将Json传递给自定义的AngularJS指令

时间:2014-10-14 13:34:55

标签: angularjs angularjs-directive

我想将参数传递给自定义指令

我的指令是:

phonecatApp.directive('demoDirective', function($compile) {
    return {
      template: '<div></div>',
      replace: true,
      link: function(scope, element, attrs) {
        var el = angular.element('<span/>');

        console.log(JSON.stringify(attrs)); // Here I want to print json passed as arguments

        var day = ["zondag","maandag" ,"dinsdag", "woensdag" ,"donderdag" , "vrijdag" , "zaterdag"];
            var d = new Date();
            var n = d.getDay(); 
            var temp = "";


        for(i=n ; i<6 ; i++){



             var myString = '<li> <input class="checkleveringsdag" name="leveringsdag" value="2014-10-14" checked=""  type="radio">&nbsp;' + day[i] + '</li>';
             temp += myString;
            }
        for(i=0 ; i<n ; i++){

             var myString = '<li> <input class="checkleveringsdag" name="leveringsdag" value="2014-10-14" checked=""  type="radio">&nbsp;' + day[i] + '</li>';
             temp += myString;
            }
        $compile(temp)(scope);
        element.append(temp);
      }
    }
  });

我的 HTML

<ul  class="leveringsdag" style="margin-top:20px;" demo-directive =  "{{data.name}}">


 </ul>

2 个答案:

答案 0 :(得分:0)

您可以使用此处记录的指令绑定来执行此操作。查找指令定义的“范围”属性。

https://code.angularjs.org/1.2.26/docs/guide/directive

答案 1 :(得分:0)

 phonecatApp.directive('demoDirective', function($compile) {
    return {
      restrict: 'E',
      template: '<div></div>',
      replace: true,
      scope:
      {
         data: '='
      }
      link: function(scope, element, attrs) {
        var el = angular.element('<span/>');

        console.log(JSON.stringify(attrs)); // Here I want to print json passed as arguments

        var day = ["zondag","maandag" ,"dinsdag", "woensdag" ,"donderdag" , "vrijdag" , "zaterdag"];
            var d = new Date();
            var n = d.getDay(); 
            var temp = "";


        for(i=n ; i<6 ; i++){



             var myString = '<li> <input class="checkleveringsdag" name="leveringsdag" value="2014-10-14" checked=""  type="radio">&nbsp;' + day[i] + '</li>';
             temp += myString;
            }
        for(i=0 ; i<n ; i++){

             var myString = '<li> <input class="checkleveringsdag" name="leveringsdag" value="2014-10-14" checked=""  type="radio">&nbsp;' + day[i] + '</li>';
             temp += myString;
            }
        $compile(temp)(scope);
        element.append(temp);
      }
    }
  });

试试这个:

<demo-directive data="data"></demo-directive>

DEMO