jjzjj

javascript - Angular $setPristine() 不工作

coder 2025-02-16 原文

我正在尝试使用 Angular 的内置表单函数,特别是 setPristine() 来清除用户提交的表单。我的 Controller 可以访问 $scope.newForm(我的表单)及其所有方法,但运行 $scope.newForm.$setPristine() 不会重置表单字段。

这是我的 HTML:

<div ng-controller="NewFormController">
    <h3>New Entry</h3>

    <form name="newForm" method="post" novalidate>
        <div class="input-group">
            <label>Name</label>
            <input name="name" type="text" ng-model="place.name"/>
        </div>
        <div class="input-group">
            <label>Description</label>
           <textarea name="description" type="text" ng-model="place.description"></textarea>
        </div>
        <div class="input-group">
           <label>Neighborhood</label>
           <input name="neighborhood" type="text" ng-model="place.neighborhood"/>
        </div>
        <div class="input-group">    
            <label>Address</label> 
           <input name="location" type="text" ng-model="place.address"/>
        </div>
        <input type="submit" value="Submit" ng-click="submit(place)"/>
    </form>
</div>

这是我调用 setPristine() 的 Controller :

app.controller('NewFormController', function($scope, $compile) {

    $scope.place = { 
        name: 'ExamplePlace', 
        description: 'This is a description!', 
        neighborhood: 'Manhattan', 
        address: '112 Street Place' 
    };

    $scope.submit = function(place) {
        $scope.newForm.$setPristine();
        $scope.newForm.$setUntouched();
    };

});

Here is a working codepen重现了我的问题。

注意:我使用的是 Angular 版本 1.4.3。

最佳答案

$setPristine 仅将表单标记为 $pristine,这对验证驱动的表达式和 CSS 很有用(例如 .ng-dirty)

因此,$setPristine 不会清除表单的控件。事实上,它甚至不知道如何去做。考虑一下,“清除”对于不同的模型可能意味着不同的事情。 “Clear”可能表示 “”undefinednull,或者任何与 一起使用的自定义输入控件ngModel 可能意味着。

因此,要正确清除表单,就是修改驱动表单的 View 模型,以达到它需要的任何“清除”定义。在大多数情况下——包括你的——这只是将 View 模型设置为一个新对象的问题:

$scope.submit = function(place) {
   $scope.newForm.$setPristine();
   $scope.newForm.$setUntouched();

   // clear the form
   $scope.place = {};
};

关于javascript - Angular $setPristine() 不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32029889/

有关javascript - Angular $setPristine() 不工作的更多相关文章

  1. ruby-on-rails - 由于 "wkhtmltopdf",PDFKIT 显然无法正常工作 - 2

    我在从html页面生成PDF时遇到问题。我正在使用PDFkit。在安装它的过程中,我注意到我需要wkhtmltopdf。所以我也安装了它。我做了PDFkit的文档所说的一切......现在我在尝试加载PDF时遇到了这个错误。这里是错误:commandfailed:"/usr/local/bin/wkhtmltopdf""--margin-right""0.75in""--page-size""Letter""--margin-top""0.75in""--margin-bottom""0.75in""--encoding""UTF-8""--margin-left""0.75in""-

  2. ruby-on-rails - 'compass watch' 是如何工作的/它是如何与 rails 一起使用的 - 2

    我在我的项目目录中完成了compasscreate.和compassinitrails。几个问题:我已将我的.sass文件放在public/stylesheets中。这是放置它们的正确位置吗?当我运行compasswatch时,它不会自动编译这些.sass文件。我必须手动指定文件:compasswatchpublic/stylesheets/myfile.sass等。如何让它自动运行?文件ie.css、print.css和screen.css已放在stylesheets/compiled。如何在编译后不让它们重新出现的情况下删除它们?我自己编译的.sass文件编译成compiled/t

  3. ruby - 无法让 RSpec 工作—— 'require' : cannot load such file - 2

    我花了三天的时间用头撞墙,试图弄清楚为什么简单的“rake”不能通过我的规范文件。如果您遇到这种情况:任何文件夹路径中都不要有空格!。严重地。事实上,从现在开始,您命名的任何内容都没有空格。这是我的控制台输出:(在/Users/*****/Desktop/LearningRuby/learn_ruby)$rake/Users/*******/Desktop/LearningRuby/learn_ruby/00_hello/hello_spec.rb:116:in`require':cannotloadsuchfile--hello(LoadError) 最佳

  4. ruby-on-rails - rspec should have_select ('cars' , :options => ['volvo' , 'saab' ] 不工作 - 2

    关闭。这个问题需要detailsorclarity.它目前不接受答案。想改进这个问题吗?通过editingthispost添加细节并澄清问题.关闭8年前。Improvethisquestion在首页我有:汽车:VolvoSaabMercedesAudistatic_pages_spec.rb中的测试代码:it"shouldhavetherightselect"dovisithome_pathit{shouldhave_select('cars',:options=>['volvo','saab','mercedes','audi'])}end响应是rspec./spec/request

  5. ruby-on-rails - s3_direct_upload 在生产服务器中不工作 - 2

    在Rails4.0.2中,我使用s3_direct_upload和aws-sdkgems直接为s3存储桶上传文件。在开发环境中它工作正常,但在生产环境中它会抛出如下错误,ActionView::Template::Error(noimplicitconversionofnilintoString)在View中,create_cv_url,:id=>"s3_uploader",:key=>"cv_uploads/{unique_id}/${filename}",:key_starts_with=>"cv_uploads/",:callback_param=>"cv[direct_uplo

  6. ruby - JetBrains RubyMine 3.2.4 调试器不工作 - 2

    使用Ruby1.9.2运行IDE提示说需要gemruby​​-debug-base19x并提供安装它。但是,在尝试安装它时会显示消息Failedtoinstallgems.Followinggemswerenotinstalled:C:/ProgramFiles(x86)/JetBrains/RubyMine3.2.4/rb/gems/ruby-debug-base19x-0.11.30.pre2.gem:Errorinstallingruby-debug-base19x-0.11.30.pre2.gem:The'linecache19'nativegemrequiresinstall

  7. ruby - `rescue $!` 是如何工作的? - 2

    我知道全局变量$!包含最新的异常对象,但我对下面的语法感到困惑。谁能帮助我理解以下语法?rescue$! 最佳答案 此构造可防止异常停止您的程序并使堆栈跟踪冒泡。它还会将该异常作为值返回,这很有用。a=get_me_datarescue$!在此行之后,a将保存请求的数据或异常。然后您可以分析该异常并采取相应措施。defget_me_dataraise'Nodataforyou'enda=get_me_datarescue$!puts"Executioncarrieson"pa#>>Executioncarrieson#>>#更现实的

  8. ruby - File.read ("| echo mystring") 是如何工作的? - 2

    我在我正在处理的一些代码中发现了这一点。它旨在解决从磁盘读取key文件的要求。在生产环境中,key文件的内容位于环境变量中。旧代码:key=File.read('path/to/key.pem')新代码:key=File.read('|echo$KEY_VARIABLE')这是如何工作的? 最佳答案 来自IOdocs:Astringstartingwith“|”indicatesasubprocess.Theremainderofthestringfollowingthe“|”isinvokedasaprocesswithappro

  9. ruby - 这个 ruby​​ 注入(inject)魔术是如何工作的? - 2

    我今天看到了一个ruby​​代码片段。[1,2,3,4,5,6,7].inject(:+)=>28[1,2,3,4,5,6,7].inject(:*)=>5040这里的注入(inject)和之前看到的完全不一样,比如[1,2,3,4,5,6,7].inject{|sum,x|sum+x}请解释一下它是如何工作的? 最佳答案 没有魔法,符号(方法)只是可能的参数之一。这是来自文档:#enum.inject(initial,sym)=>obj#enum.inject(sym)=>obj#enum.inject(initial){|mem

  10. ruby-on-rails - attr_accessible 在 Rails 中如何工作? - 2

    我刚刚有一个关于RubyonRails和模型(Rails3)中的attr_accessible属性的一般性问题。有人可以解释应该在那里定义哪些模型属性吗?我记得一些关于批量分配风险的事情,虽然我在这方面不太了解......谢谢:) 最佳答案 想象一个带有一些字段的订单类:Order.new({:type=>'Corn',:quantity=>6})现在假设订单也有折扣代码,比如:price_off。您不想将:price_off标记为attr_accessible。这会阻止恶意代码制作最终会执行如下操作的帖子:Order.new({:

随机推荐