使用Angularjs组件的简单Hello World

Question

这是我第一次尝试使用angularJs组件，请耐心等待。任何想法为什么它不会打印Hello World？

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

的script.js

>

的index.html

(function () {

  'use strict';

    angular
         .module('myApp', [])
         .component('sampleComponent', {
             template: '<h1>Hello {{$ctrl.name}}!</h1>',
             bindings: {
                 name: '<'
             },
             controller: function () {
               //alert('here');
             }
         });

})();

Answer 1

您正在使用'<'进行绑定。这意味着在传递name="World"时，World应该是一个Angular表达式，其值将传递给组件。由于根范围中没有World变量，因此未定义，因此显示空字符串。

使用'@'进行绑定，或使用name="'World'"。