Angularjs - 通过参数指令

问题描述

我想知道是否有一个参数传递给一个指令的方式？

Im wondering if there is a way to pass an argument to a directive?

我想要做的就是从这样的控制器添加一个指令：

What I want to do is append a directive from the controller like this:

$scope.title = "title";
$scope.title2 = "title2";

angular.element(document.getElementById('wrapper')).append('<directive_name></directive_name>');

是否有可能在同一时间传递参数，所以我的指令模板的内容可以链接到一个范围或其他？

Is it possible to pass an argument at the same time so the content of my directive template could be linked to one scope or another?

这里是指令：

app.directive("directive_name", function(){
    return {
        restrict:'E',
        transclude:true,
        template:'<div class="title"><h2>{{title}}</h3></div>',
        replace:true
    };
})

如果我想使用相同的指令，但什么用$ scope.title2？

What if I want to use the same directive but with $scope.title2 ?

有何意见？

更新：

下面是我如何解决我的问题：

Here is how I solved my problem:

指令

app.directive("directive_name", function(){
    return {
        restrict:'E',
        transclude:true,
        template: function(elem, attr){
           return '<div><h2>{{'+attr.scope+'}}</h3></div>';
        },
        replace:true
    };
})

控制器

$scope.building = function(data){
    var chart = angular.element(document.createElement('directive_name'));
    chart.attr('scope', data);
    $compile( chart )( $scope );
    angular.element(document.getElementById('wrapper')).append(chart);
  }

我现在可以通过同一个指令中使用不同的范围和动态添加他们。

I now can use different scopes through the same directive and append them dynamically.

推荐答案

下面是我如何解决我的问题：

Here is how I solved my problem:

指令

app.directive("directive_name", function(){
    return {
        restrict: 'E',
        transclude: true,
        template: function(elem, attr){
           return '<div><h2>{{'+attr.scope+'}}</h2></div>';
        },
        replace: true
    };
})

控制器

$scope.building = function(data){
    var chart = angular.element(document.createElement('directive_name'));
    chart.attr('scope', data);
    $compile(chart)($scope);
    angular.element(document.getElementById('wrapper')).append(chart);
  }

我现在可以通过同一个指令中使用不同的范围和动态添加他们。

I now can use different scopes through the same directive and append them dynamically.

这篇关于Angularjs - 通过参数指令的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！