AngularJS指令未获取范围内传递的数据

时间:2016-09-08 17:32:52

标签: javascript html angularjs

这是我的html代码段:

<div ng-controller="ctrl">
<custom-tag
title = "name"
body = "content">
</custom-tag>
</div>

这是控制器和指令:

var mod = angular.module("main_module",[]);

//Controller
mod.controller("ctrl",function($scope) {
  $scope.name="Page Title";
  $scope.content="sample_template.html";
  });

//Directive
mod.directive("customTag", function() {
  return {
    'restrict' : 'E',
    'scope' : {
      'title' : '=',
      'body : '='
      },
    'templateUrl' : 'directive_template.html'
    };
  });
<!-- directive_template.html -->

<div>
  <div>{{title}}</div>
  <div ng-include="'{{body}}'"></div>
</div>

指令呈现的实际html是:

<div>
  <div ng-binding></div>
  <!-- ngInclude: '{{body}}' -->
</div>

显然,它没有从<custom_tag>

中的属性获取指令范围变量

请告诉我为什么会这样,以及我如何解决这个问题。 感谢

1 个答案:

答案 0 :(得分:1)

检查控制台是否有错误的额外报价和{{}}大括号打破了。

TabControl.

http://plnkr.co/edit/G9JfIJGhSghUbgkKLXnV?p=preview