角度指令范圍未綁定數據

Question

我有一個問題，像這樣的代碼：

HTML：

<div class="overflow-hidden ag-center" world-data info="target"></div>

JS：

.directive('worldData', ['$interval', function($interval) {
    return {
        scope: {
            chart: '=info'
        },

        template: '<div>{{chart.aaa}}</div>',

        link: function($scope, element, attrs) {

            $scope.target = {'aaa': 'aaa'};

            aaa = $scope.chart;
        }
    }
}])

圖表值未定義，模板沒有值，但是當我在控制器中聲明$ scope.target時，代碼有效，為什么？

Answer 1

通常應采用以下模式：

.controller('myController', function($scope){
    $scope.target = {'aaa': 'aaa'}; //In reality, you'd normally load this up via some other method, like $http.
})

.directive('worldData', [function() {
    return {
        scope: {
            chart: '=info'
        },

        template: '<div>{{chart.aaa}}</div>'
     }
}])

-

<div ng-controller="myController">
    <div class="overflow-hidden ag-center" world-data info="target"></div>
</div>

另外，該指令可能負責處理和獲取數據，而不傳遞任何數據給它。 如果您不需要多個位置的數據，則只需要考慮一下。