角JS形式只运行一次

Question

我在用我的角度学习一开始，我实现了这个形式： http://codepen.io/jgrecule/pen/WxgqqO

什么是应该做的是很基本的：它消耗的Flickr公共JSONP饲料按闪烁规格https://www.flickr.com/services/feeds/docs/photos_public/并呈现检索到的图片缩略图

我实现的表单具有提交按钮以及重置按钮。我的问题，我想也是按照重要性的顺序找到的解决方案是：

1. ，当你键入的标签一切正常，但是当u试图通过添加一个新的标签或用户再次提交请求的第一次身份证或任何它不再有效。我可以看到在日志中这样的警告，但我不知道是什么原因造成WARNING: Tried to load angular more than once.
2. 复位仅适用于缩略图而不是在我的页面的其他控件
3. 我想找到一种方式来显示的用户按下search flicker按钮并且标签和用户标识输入字段都为空时出现错误消息。我试图实现一个自定义指令，但它没有办法让它工作。

非常感谢您的意见。

Answer 1

1. 你是加载Angular不止一次。

   

2. 你resetForm功能不重置表单都没有。它只是在两个表单元素上调用$setValidity。
   它看起来像它不试着和

   document.getElementById("searchCriteriaTags").innerHTML = ""; 
   document.getElementById("searchCriteriaIds").innerHTML = ""; 
   document.getElementById("images").innerHTML = ""; 
   

   重置表单在你的代码的另一部分，这意味着你是直接修改DOM，对此见点4

3. 可以添加简单检查$scope.form.tags === ''是否与表单中的其他字段相同。

4. 解决了你的3点后，我不敢说你的代码有更大的问题。你直接在整个地方修改DOM，你有很多重复的代码，加上很多非常复杂的条件。

---

编辑1响应OP的评论：

1. 清除表单字段是简单地清除范围的对象，表单字段绑定到的角方式。换句话说，它是做这样的事情非常简单：

   $scope.tags = [] // for arrays 
   $scope.name = '' // for strings 
   

   因为表单字段通过ng-model指令绑定到这些范围的变量，改变变量也将改变表单字段。

2. 当两个字段为空，你可以像这样设置的错误消息：

   $scope.checkFields = function(field1, field2) { 
       var oneEmpty = field1 === ''; 
       var twoEmpty = field2 === ''; 
       if (oneEmpty && twoEmpty) { 
        // call the failure message here 
       } 
   } 
   

---

EDIT 2响应评论：

1. 首先好看到你的代码看起来更干净。其次，它失败的原因是因为在您的搜索功能中，您将搜索字段设置为null，例如searchCriteria.tags = null;。您应该将它们设置为空字符串：searchCriteria.tags = '';。

2. 我不知道checkFields的目的是什么，所以我不知道你想把它放在哪里。如果你想显示错误信息，如果字段为空，那么我会说checkFields()返回一个布尔值，并使用ng-show来显示错误div，如果checkFields() === false。

   HTML：

   <div ng-show="checkFields() === false">Fields can't be empty</div> 
   

   JS：

   $scope.checkFields = function(field1, field2) { 
       var oneEmpty = field1 === ''; 
       var twoEmpty = field2 === ''; 
       return (oneEmpty || twoEmpty); 
   }