HTMLに次の行があります。
<div ng-bind-html-unsafe="departmentConfig" class="control-group"></div>
get を使用$resource
して HTML を取得し、HTML を に割り当てる$scope.departmentConfig
と、ビューが完全に更新されます。に割り当てられた HTML には属性を$scope.departmentConfig
含むフォーム要素が含まれていng-model
ますが、これらの入力要素の値を変更すると、$scope
モデルがまったく更新されません。
これは、他の多くのインターネット投稿に基づいて私が試したものであり、機能していません:
$resource('resources/sources/departments/:mappedName', {
mappedName:departmentKey
}).get(function(departmentConfig) {
// This will call another function that will build a chunk of HTML
$scope.departmentConfig = $scope.buildDepartmentConfigHtml(departmentConfig);
// This is my feeble attempt to access the element, and bootstrap it to include the items in the $scope model.
var $departmentConfigContainer = $('#departmentConfig');
angular.bootstrap($departmentConfigContainer, ['sourcemanager']);
これが機能しているように見えるいくつかのjsFiddleの例を見たことがありますが、私のものはそうではありません。ブートストラップを呼び出すのが早すぎますか? 私はまた、このような$watch
上に置いてみました$scope.departmentConfig
:
$scope.$watch('departmentConfig', function() {
var $departmentConfigContainer = $('#departmentConfig');
angular.bootstrap($departmentConfigContainer);
});
しかし、それもうまくいきませんでした。これには簡単な説明があるに違いありませんがng-model
、ページのコンパイル後にモデルにバインドするためにロードされる入力要素を取得できないようです。これは、自分のページで作業するために必要な最後の機能です。私の設定についても詳しい情報が必要な場合はお知らせください。
簡単に言えば、DOM がロードされたことを知った後で、DOM のセクションを強制的に再コンパイルするにはどうすればよいでしょうか?
アップデート
ここに、私がやりたいことの概要を説明する jsfiddle があります: http://jsfiddle.net/j_snyder/ctyfg/。プロパティ 2 と 3 がモデルを更新しないことに気付くでしょう。モデル バインディングにそれらが含まれることを期待して、外側の div でブートストラップを呼び出しています。jsfiddle に投稿するのはこれが初めてです。例が表示されない場合はお知らせください。