AngularJS

Question

早上好，

我编写的一个新组件出现问题，其中的值没有像我想象的那样传递给控制器。

让我们看看这个组件声明，你可以看到我传入了两个字符串和一个对象，该对象相当于来自父控制器的一个数字。让我们假设 'url' 和 'pagesize' 都已经很好地工作了——他们确实做到了:)

<paging url="/myurl.html" pagesize="10" numberofitems="ctrl.mynumber"></paging>

你可以看到我在这里创建了一个新模块，它目前只显示一个段落标记，其中显示了数字 'ctrl.numberofitems' 变量。重要的是要知道这有效并且值显示正确。

    angular.module('PagingModule', [])
    .component('paging', {
        scope: {},
        controllerAs: 'ctrl',
        bindings: {
            url: '@',
            pagesize: '@',
            numberofitems: '='
        },
        controller: pagingController,
        template: '<p>{{ctrl.numberofitems}}</p>'
    });

    function pagingController() {
        var vm = this;
        $scope.$watch("ctrl.numberofitems", function (val) { //ADDED THE WATCH AND CAN NOW SEE THE VALUE UNDEFINED, THEN POPULATED CORRECTLY
            console.log(val);
        });
    }

当我尝试引用 'vm.numberofitems' 时，我会收到未定义的信息吗？此时 'pagesize' 和 'url' 都可以完全访问和填充。

编辑：现在，如果我引用如上所示的 $scope.watch，我可以访问从我的控制器中推送的值——但我现在注意到的是该值是未定义的，然后当服务的承诺得到解决时，它会更改为实际列表本身。

问题现在变了:) 为什么我必须做这个$watch？这似乎完全矫枉过正，而且显然很昂贵；我只是错过了一个我可以使用的非常明显的模式吗？

再次感谢

Answer 1

尝试等待 $onInit。

After the controller is instantiated, the initial values of the isolate scope bindings will be bound to the controller properties. You can access these bindings once they have been initialized by providing a controller method called $onInit, which is called after all the controllers on an element have been constructed and had their bindings initialized.

-- https://docs.angularjs.org/api/ng/service/$compile#-bindtocontroller-

接下来要做的是在上面放一个 $watch。

$scope.$watch("ctrl.numberofitems", function(newValue) {
    console.log(newValue);
});

如果视图可以看到，手表应该也能看到。

AngularJS - 接收动态内容的组件

AngularJS - Component receiving dynamic content

javascript

components

controller