javascript - 指令应从模板或控制器中获取数据

Question

我是angularjs的新手。我有一个显示倒计时的指令endDate。使用硬编码值一切正常：

var endDate = new Date("2013-11-26T10:00:00Z");

但是我无法管理如何从控制器或渲染模板动态地将值传递给指令，因为我的指令有两个用例。

CountDownDirective.js：

app.directive("countdown", ["$window", function($window) {

return {
    restrict: "EA",
    replace: true,
    link: function(scope, element, attrs, controller) {
        function countdown(){
            var endDate = new Date("2013-11-26T10:00:00Z"); //hardcode
            //some logic...
        }

        countdown();
    }
}
}]);

SomeController.js：

app.controller("SomeController", ["$scope", '$rootScope', "APIService", 
function($scope, $rootScope, APIService){

    APIService.get('end_data').then(function(response){
        $scope.end_data = response;
        // response is "2013-11-26T10:00:00Z"
    });
    //some logic...
}
]);

模板_one.html：

<div ng-controller="SomeController">
    <div countdown>...</div>
</div>

模板_两个.html：

<div countdown end-date="2013-11-26T10:00:00Z">...</div>

提前感谢您的帮助。

Answer 1

您应该通过范围传递它。考虑在 html 中：

<div your_directive 
    message="message">
</div>

其中 message 在范围内是变量，您可以通过控制器设置：

$scope.message

然后你会在你的指令中：

app.directive("your_directive", function() {
return {
    restrict : "A",
    scope: {
        message: "="
    },

然后你可以像这样在你的链接函数中访问这个值：

scope.message