Question

第一次问问。道歉，如果我的行话不是很正确我是angularjs的新手

我有一个controller，它会获取带有HTTP调用的产品列表

contractManagementControllers.controller('PriceBandsCtrl', ['$scope', '$routeParams',     '$http', '$location',
    function ($scope, $routeParams, $http, $location)
    {
        $http.get('products').success(function (products)
        {
            $scope.productList = products
        })
    }

我希望能够访问该产品列表的directive。

contractManagementControllers.directive("priceBands",function($http)
{
    return {
        scope: true,
        restrict: 'AE',
        replace: 'true',
        templateUrl: 'Partials/PriceBand.html',
        link: function ($scope, ele, attrs, c)
        {
            // use $scope.productList
        }
});

我的问题在于事情发生的顺序。控制器功能首先运行，然后是指令链接功能，然后是设置产品列表的回调。因此，$scope.productList在指令链接函数中未定义，并给出错误

有没有办法强制链接功能等到回调完成？

Answer 1

将默认值设置为productList，以便不会收到有关未定义变量的错误

contractManagementControllers.controller('PriceBandsCtrl', ['$scope', '$routeParams',     '$http', '$location',
    function ($scope, $routeParams, $http, $location)
    {
        $scope.productList = [];
        $http.get('products').success(function (products)
        {
            $scope.productList = products
        })
    }

然后注意指令中productList的更改：

contractManagementControllers.directive("priceBands",function($http)
{
    return {
        scope: true,
        restrict: 'AE',
        replace: 'true',
        templateUrl: 'Partials/PriceBand.html',
        link: function ($scope, ele, attrs, c)
        {
            $scope.watch('productList', function(newValue, oldValue) {
                //Perform here if you need
            });
        }
});

Answer 2

无需等待callback中的angularjs。只需将$scope.productList=[];放入controller as first line即可。它不会给指令提供undefined。

在您的指令link function中，只需编写$watch函数即可观察元素中的更改。

Angularjs：我可以在控制器API回调之后运行我的指令

2 个答案: