Angualr jsディレクティブ：選択した値またはデフォルト値を設定する方法

Question

ディレクティブフォームコントロール（tesxt、select、radio）を作成しました。ディレクティブでは私が指示機能でアクセスしたいと値を渡しています。この値を設定するか、または質問（data._pageAttributes.defaultValue）から空その後、設定されたデフォルト値

HTML

<div ng-repeat="que in questions[$state.current.name]"> 
         <div ng-if="que.QuestionData._fieldType === 'text'" > 
          <!-- {{answers[que.QuestionData._attributeName]}} --> 
          <text-control-dir data="que.QuestionData" default="94403"></text-control-dir> 
         </div> 
         <div ng-if="que.QuestionData._fieldType === 'select'" > 
          <select-control-dir data="que.QuestionData" default="2016"></select-control-dir> 
         </div> 
         <div ng-if="que.QuestionData._fieldType === 'radio'" > 
          <radio-control-dir data="que.QuestionData"></radio-control-dir> 
         </div> 
         <div ng-if="que.QuestionData._fieldType === 'hidden' && que.QuestionData._attributeName != 'CBQ'" > 
          <hidden-control-dir data="que.QuestionData"></hidden-control-dir> 
         </div> 
        </div> 

controlDirectiveされていない場合。 js

(function() { 
    "use strict"; 

    angular 
      .module("autoQuote") 
      .directive('textControlDir', [textControlDir]) 
      .directive('selectControlDir', [selectControlDir]) 
      .directive('radioControlDir', [radioControlDir]) 
      .directive('hiddenControlDir', [hiddenControlDir]); 

    function textControlDir() 
    { 
     return { 
      transclude: true, 
      restrict: 'E', 
      scope: { 
       data: '=data', 
       default: '=default' 
      }, 
      template: "<div ng-transclude></div><label>{{data._text}} </label><input ng-model='answer.PC' type='text' name='{{data._attributeName}}' id='{{data._attributeName}}' value='' >" 
      , 
      link: function (scope, element, attrs) 
      { 
       console.log('default'); 
       console.log(attrs.default); 
       if(attrs.default == '') 
       { 
        attrs.default = data._pageAttributes.defaultValue; 
       } 

      } 
     }; 
    } 

    function selectControlDir() 
    { 
     return { 
      transclude: true, 
      restrict: 'E', 
      scope: { 
       data: '=data' 
      }, 
      template: "<div ng-transclude></div><label>{{data._text}} </label><select type='text' name='{{data._attributeName}}' id='{{data._attributeName}}' >\n\ 
<option ng-repeat='ans in data._answerOptions'>{{ans._promptText}}</option></select>" 
      , 
      link: function (scope, element, attrs) 
      { 
       //console.log("scope.data.QuestionData", scope.data.QuestionData); 
      } 
     }; 
    } 

    function radioControlDir() 
    { 
     return { 
      transclude: true, 
      restrict: 'E', 
      scope: { 
       data: '=data' 
      }, 
      template: "<div ng-transclude></div><label>{{data._text}} </label><input type='radio' name='{{data._attributeName}}' id='{{data._attributeName}}' value='Yes' >\n\ 
\n\ 
<input type='radio' name='{{data._attributeName}}' id='{{data._attributeName}}' value='No' >\n\ 
" 
      , 
      link: function (scope, element, attrs) 
      { 
       //console.log("scope.data.QuestionData", scope.data.QuestionData); 
      } 
     }; 
    } 

    function hiddenControlDir() 
    { 
     return { 
      transclude: true, 
      restrict: 'E', 
      scope: { 
       data: '=data' 
      }, 
      template: "<div ng-transclude></div><label>{{data._text}} </label><input type='hidden' name='{{data._attributeName}}' id='{{data._attributeName}}' value='' >" 
      , 
      link: function (scope, element, attrs) 
      { 
       //console.log(scope.data); 
      } 
     }; 
    } 

}()); 

CA.jsファイルには、フォームの質問でループするすべての質問とデフォルト値があります。

In指示文デフォルトの属性で値が渡されているかどうかを確認する操作を記述します。そうでなければ、question.queから値を取得し、inputとselectコントロールで選択してセットします。

link: function (scope, element, attrs) 
     { 
      if(attrs.default == '') 
      { 
       attrs.default = data._pageAttributes.defaultValue; 
      } 

     } 

しかし、これは私のためには機能しません。郵便番号の場合 ここで私が設定したデフォルトのテキスト（郵便番号）のためにハードコード値94403と車両年2016

用：94403は、入力ボックスに記入していない、これはその後、（CA.jsonから）35004空白の場合

する必要があります

Answer 1

デフォルトを設定しない場合、それはそれはemptyとundefinedの両方をチェックしますundefinedないempty string

link: function (scope, element, attrs) 
     { 
      if(attrs.default) 
      { 
       attrs.default = scope.data._pageAttributes.defaultValue; 
      } 

     } 

になります。

Answer 2

デフォルトの代わりにng-modelを使用し、HTML要素に対応するデータが変更された場合、コントローラのng-modelの値を設定すると、自動的にモデルが変更されます。

http://jsfiddle.net/halirgb/Lvc0u55v/

<input ng-model="example">