3

と に問題がng-showあり$pristineます。

これがコードです(これも CodePen にあります):

<blockquote ng-show="!comment.author.$pristine && !comment.rating.$pristine && !comment.comment.$pristine">
    <p>{{comment.rating}} Stars</p>
    <p>{{comment.comment}}</p>
    <footer>{{comment.author}}
</blockqoute>

フォームのすべてのフィールドが入力されたら、複製を含む div を表示したいのですが、一部がまだ空である間は非表示にしたいです。

使ってみた

!comment.[index].$pristine && ....

そのため、すべてのフィールドが入力されると、ブロック引用が表示されますが、機能しませんでした。

4

5 に答える 5

2

Hey the way you are going the main problem will be that when the user will be filling any random data in the last text box, the moment he fills a letter the div will be visible to him - despite whatever improvements you make to the code.

What I'll suggest is - make use of ng-show="whatever" for that section that you want to show after the data has been filled.

In the beginning where your controller starts make it false $scope.whatever = false; and now it wont be visible to the user; when the user has filled all the text boxes call a trigger and check if the data is valid or not and then $scope.whatever=true; - Now your section will be visible.

To call the trigger you can do various things - you can make use of ng-change on the last textbox and there check values of all textboxes using their specific model name, I hope you know that.

Let me know if you want further clarification on this.

于 2016-02-26T20:01:29.073 に答える
1

これを変える

<blockquote ng-show="!comment.author.$pristine && !comment.rating.$pristine && !comment.comment.$pristine">
                          <p>{{comment.rating}} Stars</p>
                          <p>{{comment.comment}}</p>
                          <footer>{{comment.author}}
                    </blockqoute>

これに

<blockquote ng-show="!commentForm.author.$pristine && !commentForm.comment.$pristine">
                              <p>{{comment.rating}} Stars</p>
                              <p>{{comment.comment}}</p>
                              <footer>{{comment.author}}, {{comment.date | date}}</footer>
                        </blockqoute>

スコープのプロパティではなく、フォームのプロパティを確認するためにフォームを使用していることに注意してください。(フォームの名前) に変更commentするだけです。commentForm

于 2016-02-26T19:53:37.260 に答える
0

フォーム入力の値をコントローラーのいくつかの変数にバインドし、それらのng-change="controller.validate()"実行時に検証コードを実行して、フィールドが空ではなく、入力が正しいかどうかを確認し、その後isBlockquoteVisible変数を設定すると、<blockquote ng-show="{{controller.isBlockquoteVisible}}" ...

于 2016-02-26T19:53:45.127 に答える
0
<blockquote ng-hide="comment.author.$pristine && comment.rating.$pristine && comment.comment.$pristine">
   <p ng-show="!comment.rating.$pristine">{{comment.rating}} Stars</p>
   <p ng-show="!comment.comment.$pristine">{{comment.comment}}</p>
   <footer ng-show="!comment.author.$pristine">{{comment.author}}</footer>
</blockquote>
于 2016-02-26T20:00:33.397 に答える