2016-05-31 12 views
1

私はAngularJSを学び、スコープの継承を行っただけです。以下は、私が書いたサンプルコードです。私は1.5.0範囲継承ng-bind(動作していない)vs {{}}(作業中)

HTML

<div ng-controller="ScopeInheritanceParentController" class="scope_inheritance_parent"> 
    <span>Parent</span><br /><br /> 
    <!--<span ng-bind="title" /><br /><br />--> 
    <span>{{title}}</span><br /><br /> 
    <input type="text" ng-model="title" /><br /><br /> 
    <div ng-controller="ScopeInheritanceChildController" class="scope_inheritance_child"> 
     <span>Child</span><br /><br /> 
     <!--<span ng-bind="title" /><br /><br />--> 
     <span>{{title}}</span><br /><br /> 
     <input type="text" ng-model="title" /> 
    </div> 
</div> 

JS

angular.module('myapp.controllers') 
    .controller('ScopeInheritanceParentController', ['$scope', function ($scope) { 
     $scope.title = "Initial title set by Parent controller ctor function" 
    }]) 
    .controller('ScopeInheritanceChildController', ['$scope', function ($scope) { 
     $scope.title = 'Initial title set by Child controller ctor function' 
    }]) 

これまでのところは良い角度のバージョンを参照していると私はのような出力が得られます。 enter image description here

問題

私は{{title}}構文をコメントし、コメント解除ng-bind="title"スパンは、私のように出力を参照してください。 enter image description here

  1. どこ児童コントローラは今?
  2. 親コントローラのテキストボックスが表示されないのはなぜですか?

私は、{{}}という構文は内部的にウォッチャーを作成することがわかっているため、角度は式が変更されたときにビューを更新することができます。私はまた、ng-bind{{}}と同じであることを読んでいるので、私はそれが同じように動作すると思います。

+0

を持っていますか?あなたの問題を解決することさえできます(問題はデモでは消えます)。少なくとも私にとってあなたのコードは期待どおりに動作し、何も問題はありません。 – thepio

+1

でスパンタグを閉じる必要があります(自己囲いではありません)。http://plnkr.co/edit/yA2sN2OTCwOF5W5wcOB0?p=preview –

+0

@NitsanBaleli私はng-bindがその値を「innerHTML」することを認識していたはずです。 (唇をシールした)。 – niksofteng

答えて

1

spanタグを使用すると、この問題についてplunker/jsfiddleを作成することができ、このような構文

<span ng-bind='title'></span> 
+0

それを指摘してくれてありがとう。私は何かを学んでいる間、HTMLを忘れるべきではありません。 – niksofteng

関連する問題