この記事では、angularjsで編集した変数の初期化に失敗する原因を中心に紹介します。皆さんのお役に立てれば幸いです、一緒にこの記事を見ていきましょう
編集の初期化、編集項目をクリックして取得したid
を元に、このidを取得します。 code> をバックグラウンドから取得し、すべての情報を取得し、対応するフィールドをフロント ページに初期化します。 <code>id
,从后台获取这个id
的所有信息,然后将对应的字段初始化给前台的页面。
大部分的时候我们都不需要做什么特殊处理,因为当我们获取到了对象,通过angularjs
的双向绑定就会直接为我们做好初始化的工作。但是为什么这次我单拿出来记录呢?必然是有不同的地方。
这次编辑出现问题的点主要是在前台设计的时候,其中有个字段是精确度单位
,但是在选择单位的时候,要先选择单位的类别,而实体中又没有类别这个字段,所有就自己添加个字段,以便达到下面的效果:
先选中前面的类别下拉框,然后再点选想要的单位。
先看下我们对类别
的处理
使用下划线_
的意思就是这个变量是我们自己定义的。这就意味着,我们上面说的第一步,根据id
获取过来的对象并没有这个属相,要是让前台显示出这个类别,就需要我们自己定义一个,并赋值。这也就是标题上所说的变量
。
1.最开始定义的时候,就是在直接赋值的:
$scope.data._accuracyMeasurementUnitCategory = $scope.data.primaryParameterCategory.accuracyUnitSet[0].measurementUnitCategory;
但是这种赋值方式并不行,界面上并没有显示出来。
2.联想到前一阵遇到过一个类似的问题,问题的原因就是在angular
在进行第一次渲染的时候,$scope.data
还没有值,所以没有附上值。所以就将初始化放在回调函数中去执行:
发现还是没有成功。
3.然后对其进行监听,发现并不是没有赋值,而是赋值之后又被默认选项请选择
给覆盖掉了,所以就一直显示出这个样子:
看到这里就好办了,只要监听一下变量,当他发生改变
,并且改变后的newValue
是请选择
,那么我就对其进行初始化赋值。
$scope.$watch('data._accuracyMeasurementUnitCategory', function(newValue) { if (newValue && newValue.name === '请选择') { $scope.data._accuracyMeasurementUnitCategory = $scope.data.primaryParameterCategory.accuracyUnitSet[0].measurementUnitCategory; } });
这次成功绑定,但是好像实现的并不好:
打开控制台,可以看到出现了如上的错误:$digest达到最大迭代次数。
通过一番查找,最后找到了出现这个Error
的原因。
因为在指令中已经对类别
进行了初始化处理,将其设置为请选择
,然后我们又在控制器
中对他进行监听,当我们他产生变化并且值为请选择
的时候,给他一个新的值。
而我们知道,angular
会进行多次渲染,在指令每次渲染的时候,都设置成一次请选择
,而控制器监听到又会改变,这就产生了循环。
这时候$digest
就会遍历循环,巡查$watch
是否发生变化。然后防止无限循环下去,$digest
设置了一个最大上限,所以就出现上面截图的报错。
4.看着这一大片的红,让我感觉很是不好。考虑到我现在只是想实现简单的赋值,那使用比较简单的方法好像也不错。所以就考虑使用$timeout
来帮助实现功能,他会等一段时间后,告诉$digest
angularjs
の双方向バインディングによって直接初期化されるため、ほとんどの場合、特別な処理を行う必要はありません。しかし、なぜ今回は別々に録音したのでしょうか?何か違うはずだ。 この編集に関する問題は主にフロントエンド設計中に発生します。フィールドの 1 つは Precision Unit
ですが、ユニットを選択するときは、まずユニットのカテゴリを選択する必要があります。エンティティ カテゴリ フィールドはないため、次の効果を実現するには、自分でフィールドを追加するだけです:
category
の処理を見てみましょう🎜🎜🎜🎜🎜🎜アンダースコア _
を使用すると、この変数が自分たちで定義されることを意味します。これは、上で説明した最初のステップで、id
に基づいて取得されたオブジェクトにはこの属性がないことを意味します。このカテゴリをフロント デスクに表示したい場合は、自分でカテゴリを定義する必要があります。値を割り当てます。これは、タイトルに 変数
と表示されているものです。 🎜// 初始化主参量的单位 $timeout(function() { $scope.data._accuracyMeasurementUnitCategory = $scope.data.primaryParameterCategory.accuracyUnitSet[0].measurementUnitCategory; }, 100);
angular
が初めてレンダリングされたときに、$scope.data
がまだそこには価値がないので、値は付けられません。したがって、コールバック関数に初期化を入れて実行します: 🎜🎜🎜🎜🎜🎜やはり失敗していることが分かりました。 🎜🎜3. その後、それを監視したところ、値が割り当てられていないのではなく、値が割り当てられた後、デフォルトのオプション Please select
によって上書きされ、常に表示されることがわかりました。このように: 🎜🎜🎜🎜🎜🎜ここでの処理は簡単です。変数が 変化する
とき、変更された newValue
は 選択してください
です。 、その後、初期化代入を実行します。 🎜rrreee🎜今回バインディングは成功しましたが、実装が良くないようです: 🎜🎜🎜🎜🎜🎜 コンソールを開くと、上記のエラーが表示されます: $digest が反復の最大数に達しました。 🎜🎜いくつか検索した結果、この エラー
の理由がついに見つかりました。 🎜🎜4. この広い範囲の赤いものを見ると、とても気分が悪くなります。今は単純な割り当てを実装したいだけであることを考えると、より単純な方法を使用するのが良さそうです。そこで、関数の実装を支援するためにcategory
は命令内で初期化されているため、それをPlease select
に設定し、Controller
に移動して監視します。変更されたら新しい値を指定します。値はPlease select
です。
そして、angular
が複数回レンダリングされることがわかっています。命令が毎回レンダリングされると、Please select
が 1 回に設定され、コントローラーが監視して実行されます。変化することでサイクルが生まれます。
この時点で、$digest
はループを走査し、$watch
が変更されたかどうかを確認します。次に、無限ループを防ぐために、$digest
で上限を設定するため、上のスクリーンショットのエラーが表示されます。
$timeout
を使用することを検討しました。この関数は、一定時間待機してから、$digest
にレンダリングを指示します。この時点で、必要な値が利用可能になります。 🎜rrreee🎜🎜🎜🎜🎜🎜それで、問題は解決しました。 🎜より高度なメソッドを使用して機能を実装しようとすると、現時点では十分な蓄積がされていないことを意味するだけなので、シンプルなメソッドに変更する方が良い選択です。 angularjs についてさらに詳しく知りたい場合は、PHP 中国語 Web サイト angularjs Reference Manual のコラムにアクセスして学習してください
[編集者の推奨]
angularjs 式の使用方法? angularjs式の使用例
angularjsフィルターは使える? angularjsフィルターの詳しい説明を見てみましょう
以上がAngular エディターが変数の初期化に失敗しました。理由はわかりますか? angularjsの初期化失敗の詳細な説明は次のとおりです。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。