javascript - 从 Ionic 模态调用函数后参数困惑

coder 2024-07-20 原文

我有一个带有简单按钮的 View ，用于在 Ionic+Angular 应用程序中打开模式。单击按钮后正确显示模态模板:

<ion-modal-view>
  <ion-header-bar>
    <h1 class="title">Popular tags</h1>
    <div class="buttons">
      <button class="button button-clear button-stable" ng-click="closePopularForm()">Close</button>
    </div>
  </ion-header-bar>
  <ion-content>
      <div class="list">
        <div class="item-divider text-center">
          Select a tag to follow.
        </div>
        <label class="item">
        <button class="button button-balanced" ng-click="addPopularTag('china')">China</button>
            <button class="button button-balanced" ng-click="addPopularTag('uk')">United Kingdom</button>
            <button class="button button-balanced" ng-click="addPopularTag('us')">United States</button>
        </label>
      </div>
  </ion-content>
</ion-modal-view>

如您所见，模态框包含 3 个按钮，每个按钮调用相同的函数但具有不同的参数。我有这个包含功能的 Controller :

app.controller('HomeCtrl', function($scope, $ionicSideMenuDelegate, $ionicModal) {

  $ionicModal.fromTemplateUrl('add-popular.html', { scope: $scope }).then(function(modal) {
        $scope.modalPopular = modal;
    });

    $scope.closePopularForm = function() {
        $scope.modalPopular.hide();
    };

    $scope.openPopularForm = function() {
        $scope.modalPopular.show();
    };

    $scope.addPopularTag = function(poptag) {
        console.log(poptag);
        console.log('pop form submited '+poptag);
    };  
});

问题在于，无论在模式中单击哪个按钮，函数 addPopularTag 都会使用第一个按钮的参数(在本例中为 china)调用。我检查了按钮的 html 源代码，它们使用不同的参数正确呈现。

Here is a reproduction of the issue in Codepen. 您可以在控制台中看到它。

最佳答案

替换

<label class="item">
  <button class="button button-balanced" ng-click="addPopularTag('china')">China</button>
  <button class="button button-balanced" ng-click="addPopularTag('uk')">United Kingdom</button>
  <button class="button button-balanced" ng-click="addPopularTag('us')">United States</button>
</label>

与

<button class="button button-balanced" ng-click="addPopularTag('china')">China</button>
<button class="button button-balanced" ng-click="addPopularTag('uk')">United Kingdom</button>
<button class="button button-balanced" ng-click="addPopularTag('us')">United States</button>

虽然我不知道这个标签是做什么的

关于javascript - 从 Ionic 模态调用函数后参数困惑，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39140774/

javascript 困惑 button 34 addPopularTag angularjs ionic-framework

有关javascript - 从 Ionic 模态调用函数后参数困惑的更多相关文章

ruby-on-rails - 如何在 ruby 中使用两个参数异步运行 exe？ - 2
exe应该在我打开页面时运行。异步进程需要运行。有什么方法可以在ruby中使用两个参数异步运行exe吗？我已经尝试过ruby命令-system()、exec()但它正在等待过程完成。我需要用参数启动exe，无需等待进程完成是否有任何rubygems会支持我的问题？最佳答案您可以使用Process.spawn和Process.wait2:pid=Process.spawn'your.exe','--option'#Later...pid,status=Process.wait2pid您的程序将作为解释器的子进程执行。除
ruby - RSpec - 使用测试替身作为 block 参数 - 2
我有一些Ruby代码，如下所示:Something.createdo|x|x.foo=barend我想编写一个测试，它使用double代替block参数x，这样我就可以调用:x_double.should_receive(:foo).with("whatever").这可能吗？最佳答案 specify'something'dox=doublex.should_receive(:foo=).with("whatever")Something.should_receive(:create).and_yield(x)#callthere
ruby - 如何在 Ruby 中拆分参数字符串 Bash 样式？ - 2
我正在为一个项目制作一个简单的shell，我希望像在Bash中一样解析参数字符串。foobar"helloworld"fooz应该变成:["foo","bar","helloworld","fooz"]等等。到目前为止，我一直在使用CSV::parse_line，将列分隔符设置为""和.compact输出。问题是我现在必须选择是要支持单引号还是双引号。CSV不支持超过一个分隔符。Python有一个名为shlex的模块:>>>shlex.split("Test'helloworld'foo")['Test','helloworld','foo']>>>shlex.split('Test"
ruby - 在没有 sass 引擎的情况下使用 sass 颜色函数 - 2
我想在一个没有Sass引擎的类中使用Sass颜色函数。我已经在项目中使用了sassgem，所以我认为搭载会像以下一样简单:classRectangleincludeSass::Script::FunctionsdefcolorSass::Script::Color.new([0x82,0x39,0x06])enddefrender#hamlengineexecutedwithcontextofself#sothatwithintemlateicouldcall#%stop{offset:'0%',stop:{color:lighten(color)}}endend更新:参见上面的#re
ruby - 检查方法参数的类型 - 2
我不确定传递给方法的对象的类型是否正确。我可能会将一个字符串传递给一个只能处理整数的函数。某种运行时保证怎么样？我看不到比以下更好的选择:defsomeFixNumMangler(input)raise"wrongtype:integerrequired"unlessinput.class==FixNumother_stuffend有更好的选择吗？最佳答案使用Kernel#Integer在使用之前转换输入的方法。当无法以任何合理的方式将输入转换为整数时，它将引发ArgumentError。defmy_method(number)
ruby-on-rails - 在默认方法参数中使用 .reverse_merge 或 .merge - 2
两者都可以defsetup(options={})options.reverse_merge:size=>25,:velocity=>10end和defsetup(options={}){:size=>25,:velocity=>10}.merge(options)end在方法的参数中分配默认值。问题是:哪个更好？您更愿意使用哪一个？在性能、代码可读性或其他方面有什么不同吗？编辑:我无意中添加了bang(!)...并不是要询问nobang方法与bang方法之间的区别最佳答案我倾向于使用reverse_merge方法:option
ruby-on-rails - 在 ruby 中使用 gsub 函数替换单词 - 2
我正在尝试用ruby中的gsub函数替换字符串中的某些单词，但有时效果很好，在某些情况下会出现此错误？这种格式有什么问题吗NoMethodError(undefinedmethod`gsub!'fornil:NilClass):模型.rbclassTest"replacethisID1",WAY=>"replacethisID2andID3",DELTA=>"replacethisID4"}end另一个模型.rbclassCheck 最佳答案啊，我找到了!gsub!是一个非常奇怪的方法。首先，它替换了字符串，所以它实际上修改了
使用 ACL 调用 upload_file 时出现 Ruby S3 "Access Denied"错误 - 2
我正在尝试编写一个将文件上传到AWS并公开该文件的Ruby脚本。我做了以下事情:s3=Aws::S3::Resource.new(credentials:Aws::Credentials.new(KEY,SECRET),region:'us-west-2')obj=s3.bucket('stg-db').object('key')obj.upload_file(filename)这似乎工作正常，除了该文件不是公开可用的，而且我无法获得它的公共(public)URL。但是当我登录到S3时，我可以正常查看我的文件。为了使其公开可用，我将最后一行更改为obj.upload_file(file
ruby - 在 Ruby 中有条件地定义函数 - 2
我有一些代码在几个不同的位置之一运行:作为具有调试输出的命令行工具，作为不接受任何输出的更大程序的一部分，以及在Rails环境中。有时我需要根据代码的位置对代码进行细微的更改，我意识到以下样式似乎可行:print"Testingnestedfunctionsdefined\n"CLI=trueifCLIdeftest_printprint"CommandLineVersion\n"endelsedeftest_printprint"ReleaseVersion\n"endendtest_print()这导致:TestingnestedfunctionsdefinedCommandLin
ruby - 定义方法参数的条件 - 2
我有一个只接受一个参数的方法:defmy_method(number)end如果使用number调用方法，我该如何引发错误？？通常，我如何定义方法参数的条件？比如我想在调用的时候报错:my_method(1) 最佳答案您可以添加guard在函数的开头，如果参数无效则引发异常。例如:defmy_method(number)failArgumentError,"Inputshouldbegreaterthanorequalto2"ifnumbereputse.messageend#=>Inputshouldbegreaterthano

javascript - 从 Ionic 模态调用函数后参数困惑

有关javascript - 从 Ionic 模态调用函数后参数困惑的更多相关文章

随机推荐