NG-模型似乎只在模态视图内的离子单选按钮上绑定一种方式

ng-model seemingly only binding one way on ion-radio button inside modal view

本文关键字：绑定 单选按钮 方式 一种 模型 模态 视图 NG-      更新时间：2023-09-26

在我的Ionic/Angular应用程序中，我有一个范围变量，我像这样实例化：

$scope.org = 0;

然后我有一个模态对话框，我像这样实例化：

$ionicModal.fromTemplateUrl('templates/picker-modal.html', {
    scope: $scope,
    animation: 'slide-in-up'
}).then(function(modal) {
        $scope.modal = modal;
    }
)

并像这样加载：

$scope.modal.show();

在我的模态对话框定义中，我有一些数据绑定到范围级变量：

Currently selected: {{org}}            
<ion-radio ng-model="org" ng-value="0" name="grp1">Option zero</ion-radio>
<ion-radio ng-model="org" ng-value="1" name="grp1">Option one</ion-radio>
<ion-radio ng-model="org" ng-value="2" name="grp1">Option two</ion-radio>

回到我的主窗体，我也显示当前值：

Currently selected: {{org}}

在模态形式上一切都很好 - 主范围的值通过精细输入，用户可以选择。

然而。。。

我的组织价值在主窗体上永远不会更改。这怎么可能？将 org 的值从主窗体更改为模态窗体很好（因此它不会以某种单实例范围结束），但是在我的子窗体上选择内容不会更改主窗体中的组织值。

你应该

在ng-model绑定中始终有一个点。如果您使用"控制器作为"语法，它将为您处理此问题。例如 ng-model="ctrl.org"

有关更多详细信息，请参阅：http://learnwebtutorials.com/why-ng-model-value-should-contain-a-dot

$ionicModal.fromTemplateUrl 不会直接使用您在 options 参数 scope: $scope 中提供的作用域，而是创建一个子作用域。

如果要访问原始范围，则必须在对话框模板中将其引用为$parent：

<ion-radio ng-model="$parent.org" ng-value="0" name="grp1">Option zero</ion-radio> 
...
相关文章：