Question

我正在专有组件（本质上只是普通输入）之上构建组件，并且需要在所有级别上传递数据。

基本上，父级使用我的新组件，该组件使用专有的输入组件。在父级中，我需要从用户那里获得输入。我的组件仅将专有组件用作工作的基础，然后对输入进行一些工作，然后将其返回给父项。

我正在尝试使用两种方式绑定，以便父级说出它想随输入更改哪个变量，但是我无法将输入返回给父级。基本上这就是我到目前为止所拥有的：

模型是我试图做的两种绑定方式

MyComponent.js：一切正常，期望“模型”绑定似乎不会向后传递信息

import angular from "angular";

angular.module('app').component('myComponent', {
    controller: function ($scope) {

        $scope.properties = {};

        this.$onInit = function() {
            $scope.properties.testme = this.model;
        };

        $scope.onChange = function() {
            console.log("new input: " + $scope.properties.testme);
//TODO: do work on what is passed in from ng-model
            this.model = $scope.properties.testme;
        };
    },
    template: require("./myComponent.html"),
    bindings: {
        model: '='
    }
});

myComponent.html：这是显示的输入字段，而ng-model是捕获输入的内容。一切正常

<div>
    <proprietary-input
        ng-model="properties.testme"
        ng-change = "onChange()"
    >
    </proprietary-input>
</div>

parent.js

import angular from "angular";

angular.module('app').component('parent', {
    controller: function ($scope) {
        $scope.randomVar = "this should change";

    },
    template: require("./myComponent.html")
});

parent.html：调用我的组件

<div>
    <myComponent
        model="randomVar"
    ></myComponent>
</div>

长话短说，我需要“ randomVar”来等于mycomponent上ng模型中的值

对于这有点抽象或“不对劲”，我深表歉意，因为这在我解剖代码后可以公开发布以获取支持

双向绑定不更新父级

0 个答案: