2016-11-17 9 views
0

私はng形式のコンポーネントを持っています。 ng-formの名前を動的に設定して、人々がng-formの値に簡単にアクセスできるようにするため、ng形式で動的な名前を設定するには

例:

<form name="formName"> 
<component name="componentName"></component> 
</form> 

そして、私は

<ng-form name="{{$ctrl.name}}"> 
// Some inputs with special validation 
</ng-form> 

を持っているしかし、私は私のコンポーネント内の$ ctrl.nameにアクセスしようとするたびに定義されていないコンポーネントの内部、あるいは単なる文字列ではありません内部に入力があるフォーム。

私は活字体を使用

@Component(app, { 
    selector: 'component', 
    templateUrl: 'templateUrl', 
    bindings: { 
    value: '=?ngModel', 
    name: '@', 
    required: '=?ngRequired', 
    disabled: '=?ngDisabled', 

    }, 
}) 
    console.log(this.name); ///A string, but no a form so I can manipulate it. 

答えて

1

フォームオブジェクトが利用できるようにしたい場合は、サンプルコード

Component.js

angular.module('myApp').component('component', { 
    bindings: {    
     name: '@' 
    }, 
    template: 
    '<ng-form name={{$ctrl.name}}><input name="txtfirst" value="John"/><input type="button" ng-click="$ctrl.getFormData()"></ng-form>', 
    controller: function($scope) { 
     console.log(this.name); 

    this.getFormData = function(){ 
      console.log($scope[this.name]); 
    }   
    } 
}); 

HTML

<component name="frmNameTest"></component> 
+0

の場合を除き、上記のようにすることができます。コードは機能しますが、私が望むものではありません。私はフォーム名で文字列を取得し、私はコントローラ内で操作できるように、動的オブジェクト名でフォームオブジェクトを取得します。 –

+1

更新されたコードを確認してください。 "$ scope [this.name]"はフォームオブジェクトを与えます。 –

+0

それはフォーム上で動作しますが、私はNG-FORMで使いたいので、どのように正しく使用できるかはわかりません。 –

1

を以下試してみてくださいoコントローラのスコープではなく、フォームの宣言が

<form name="$ctrl[{{$ctrl.name}}]"> 
    ... 
</form> 
関連する問題