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。

控制器实例化后，隔离作用域绑定的初始值将绑定到控制器属性。您可以通过提供一个名为 $onInit 的控制器方法在初始化这些绑定后访问它们，该方法在元素上的所有控制器都已构建并初始化其绑定后调用。

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

---

接下来要做的是在上面加上$watch。

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

如果视图可以看到它，那么手表应该可以看到它。