【问题标题】:AngularJS: Setting value of form field to various object propertiesAngularJS:将表单字段的值设置为各种对象属性
【发布时间】:2017-04-20 14:06:39
【问题描述】:

我有一个简单的 AngularJS 动态表单,它由 ng-model 绑定到属性 modelParams.value。每个表单字段都显示 modelParams.value 的值 但是,我想要一个名为“Default”的按钮,它将所有表单字段的值设置为该关联数组中的某个其他属性,例如 modelParams.defaultValue 或 modelParams。旧值。我假设一旦按下“默认”按钮,这将覆盖 ng-model="modelParams.value" 的值。

这是表格:

<form name="modelParamsForm">                   
    <div class="form-group" ng-repeat="modelParam in modelParams">
        <div class="row">
         //INPUT FORM FIELDS
         <input type="number" class="form-control input-sm" required ng-
         model="modelParam.value" >
        </div>
    </div>

    <button class="btn btn-primary btn-sm" ng-
        click="updateModelParams(modelParams, modelParamsForm)">
    </button>
    //DEFAULT BUTTON
    <button type="button" class="btn btn-default btn-sm" ng-
     click="default()">Default</button>         
</form>

我的 JSON 如下所示:

[{"model":"MAF","paramname":"CascDefaultSpreadOverride","minvalue":"0","maxvalue":"100","description":"The defaault repo spread override to use for CASC positions.","defaultvalue":1.0,"value":1.0,"datatype":"FLOAT"},{"model":"MAF","paramname":"DefaultLotSize","minvalue":"1","maxvalue":"1000","description":"The minimum lot size that must be met for a collateral allocation.","defaultvalue":1.0,"value":1.0,"datatype":"INTEGER"},{"model":"MAF","paramname":"HtbColdHaircut","minvalue":"0","maxvalue":"100","description":"The haircut to apply to positions with a Cold HTB category.","defaultvalue":0.1,"value":0.1,"datatype":"FLOAT"},{"model":"MAF","paramname":"HtbExtraHotHaircut","minvalue":"0","maxvalue":"100","description":"The haircut to apply to positions with a Extra-Hot HTB category.","defaultvalue":0.9,"value":0.9,"datatype":"FLOAT"},]

【问题讨论】:

    标签: javascript angularjs json forms twitter-bootstrap


    【解决方案1】:
    $scope.field = 'value';
    
    $scope.change = function() {
      $scope.field = 'oldValue';
    }
    
    
    ...ng repeat blabla
    <input ng-model="modelParam[field]"/>
    ...
    <button ng-click="change()">Change</button>
    

    编辑:这是一个工作演示:http://jsfiddle.net/zy94an54/

    【讨论】:

    • 您能否详细说明一下。此时我正在通过 ng-repeat 获取 modelParams 中的每个对象。我想您希望我在 change() 方法中将 modelParam.value 设置为 $scope.field,然后将 modelParam.otherValue 设置为“旧值”...?这是否意味着我还必须在我的控制器中循环 modelParams 数组?
    • 我想让你做的是使用一些变量作为 modelParam 属性的索引。检查jsFiddle,应该更清楚
    • 哦,这行得通,至少在更改表单中的值时有效。但是,一旦我们单击默认值,填充表单的“旧值”不会更新数据库。也就是说,它们出现在表单中,但是一旦你调用 click="updateModelParams(modelParams, modelParamsForm)" 就好像这些值实际上并不存在......
    • 检查这个小提琴。尝试更改输入,查看正在更新的变量:jsfiddle.net/8w91m137
    • 哦不,我的错!您的代码按预期工作!但是,我想要做的是用 change() 填充表单字段,然后在 update() 上将 'oldvalue' 设置为对象中的 'value'。换句话说,我试图将对象恢复到它的“旧值”状态。我是多么愚蠢,我没有解释这一点!现在它是视图和模型中的双向绑定'oldvalue',但我需要用'oldvalue'更新'value'参数。我希望我现在更有意义...
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-04-24
    • 2015-10-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多