Question

我有一个非常基本的问题：我无法将值或其他任何内容传递给指令的模板，并且尽管尝试了很多示例，但仍将其显示在模板中。在将其归结为最基本的例子后，我已经创建了一个问题来证明这个问题。

<!doctype html>
<html ng-app='myapp'>
  <head>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
    <script src="script.js"></script>
  </head>
  <body>
    a<exampleDirective fancyname="Hello">-</exampleDirective>b
  </body>
</html>

angular.module('myapp', [])
    .directive('exampleDirective', function() {
        return {
            restrict: 'E',
            scope: {
                fancyname: "@"
            },
            template: '1<div><i>2{{fancyname}}2</i></div>1'
        };
    });

似乎模板根本没有加载，但有一点它是{{fancyname}}没有显示＆＃34; Hello＆＃34;的价值。

非常感谢对此指令NOOB的任何帮助。谢谢！

Answer 1

学习时简单易犯......

angular.module('myapp', [])
    .directive('exampleDirective', function() {
        return {
            restrict: 'E',
            scope: {
                fancyname: "@"
            },
            template: '1<div><i>2{{fancyname}}2</i></div>1'
        };
    });

等于这个HTML

<example-directive fancyname="Hello"></example-directive>

你的分叉plunker

AngularJS：简单地将值传递给指令的模板

1 个答案: