Question

我在隔离范围内有一个指令，我在指令的链接函数中定义了几个变量，因此模板无法绑定到这些变量，但是templateUrl似乎很容易绑定到这些变量...这是什么原因？

mymodule.directive("directive1", function () {

    return {



        require: '^widget',

        // template: '<div><h1 > {{editMessage}}</h1></div>',
        templateUrl: "dummy.htm",


        scope: {
    },

    link: function (scope, element, attrs) {


        scope.editMessage = "Click to edit";
 });
}
});

我的 dummy.htm 与模板内容中的代码相同： -

 <div><h1 > {{editMessage}}</h1></div>

绑定发生在我使用templateUrl但不是当我使用模板时为什么会这样？两者的执行流程是否不同？

Answer 1

问题是你没有很好地整合范围变量，它应该是这个例子：

mymodule.directive('myAlertaSeguimientoButton', function() {
return {
    restrict: 'A',
    scope: {
        myParamElemento: '=',
        myParamUrl: '@',
        myParamSeguir: '@',
        myParamDejarSeguir: '@',
        myParamSiguiendo: '@',
        myParamRefrescaMapa: '@'
    },
    template: '<button ng-class="(!myParamElemento.siguiendo)?\'btn btn-default seguir\':\'btn btn-default seguir siguiendo activeButtonAzul\'" class="btn btn-default seguir" ng-click="seguirNoSeguir(myParamUrl)"><span class="icon-seguir estadoUno">[[myParamSeguir]]</span><span class="icon-siguiendo icon-w estadoDos">[[myParamSiguiendo]]</span><span class="estadoTres">[[myParamDejarSeguir]]</span></button>',
    controller: ['$scope', 'Service', function($scope, Service) {...

在html中：

<span my-param-elemento="angular-var" my-param-url="angular-var" my-alerta-seguimiento-button></span>

孤立范围内的角度js指令中的模板和templateUrl之间的差异

1 个答案: