JSONでスコープを保存

Question

私は、ユーザーがフォーカスしているフィールドに基づいてプロンプトを表示するWebアプリケーションを作成しています。私はこれらの異なる点で表示したいテキストのスクリプトをいくつか用意しています。

私がしたいのは、それらの文字列が表示されているときにスコープデータを表示することです。今はすべてがテキストとしてレンダリングされます。ここに私がやっていることがあります。ビューで。 （私は、コントローラに変更しますNG-INITの私の貧弱な使用を無視します。）

<div><p>Full Name</p><input placeholder="Name" name="personal.name" ng-model="personal.name" ng-model-options="{ updateOn: 'default blur' }" class="medium" type="text"/></div> 
    <div><p>Address</p><input class="long" type="text" ng-model="personal.address" ng-model-options="{ updateOn: 'default blur' }" placeholder="Address"/></div> 
    <div><p>Phone</p><input placeholder="Phone" ng-model="personal.phone" type="phone" ng-model-options="{ updateOn: 'default blur' }" only-digits/></div> 

     <div ng-init="script()"> 
     <div ng-repeat="scripts in script"> 
      <div ng-show="{{scripts.element}}" ng-hide="true" class="alert-bar"> 
      <div class="wrapper"> 
       <div ng-bind="scripts.script"></div> 
      </div> 
      </div> 
     </div> 
     </div> 

とコントローラ再び私は後でこれを格納します。この中のデータを無視します。

$scope.script = function(){ 

      $scope.script = [ 
      { 
      'element': "personal.name", 
      'script': '{{personal.name}} welcome to SOCU\'s loan application.' 
      }, 
      { 
      'element': "personal.address", 
      'script': '{{personal.name}}, please enter your full current address.' 
      }, 
      { 
      'element': "personal.phone", 
      'script': '{{personal.name}}, please enter your current phone number, with the area code.' 
      } 
      ]; 
    } 

表示される名前を取得できない以外はすべて動作します。私はここで二重中括弧を使うべきではないことを知っています。私も$範囲から直接データを取得しようとしましたが、そこに個人的なデータは表示されません。

Answer 1

バインドは表示専用であるため、コントローラで行うことはできません。あなたはあなただけで、オブジェクトの要素にアクセスできるスクリプトの配列を繰り返し処理しているので

、

{{scripts.element + scripts.script}} 

ハンドルの構文は、DIV要素のために働く必要があります。下記の通り、あなたのdivに

$scope.script = [{ 
    element: 'Person name', 
    script: 'Your script' 
}]; 

、

<div ng-init="script()"> 
    <div ng-repeat="scripts in script"> 
     <div ng-show="{{scripts.element}}" ng-hide="true" class="alert-bar"> 
      <div class="wrapper"> 
       <div> 
        {{ scripts.element + " , " + scripts.script }} 
       </div> 
      </div> 
     </div> 
    </div> 
</div>