0

我遇到的问题是从我的视图输入的文本字段没有绑定到控制器。

这是视图片段：

<md-dialog-content ng-if="mode=='addSentence'" class="sticky-container">
    <md-input-container>
        <label for="sentence-text">Enter the sentence to be corrected</label>
        <input ng-model="theSentence" name="sentence-text"/>
    </md-input-container>
    <span flex>{{ error }}</span>
    <md-button class="primary" style="float:right;" aria-label="Save" ng-click="saveNewSentence()">Save</md-button>
</md-dialog-content>

这是应该处理输入的控制器函数：

function ViewSentenceController($scope, $rootScope, $mdDialog) {
    $scope.mode = mode;
    $scope.user = user;
    $scope.theSentence = null;

    $scope.saveNewSentence = function() {
        console.log($scope.theSentence);
    }

    $scope.cancel = function() { $mdDialog.hide(); }

}

当saveNewSentence()被调用时，它会记录null到控制台，即使我在文本字段中有输入。

我确定我错过了一些东西，我看不到它，但是我在这个简单的问题上花了太多时间，所以提前感谢您的帮助！

4

4 回答 4

2

您的对话框拥有自己的 $scope。所以：

 <input ng-model="$parent.theSentence" name="sentence-text"/>
    </md-input-container>
于 2016-08-23T20:11:17.940 回答
1

如果您可以分享您的完整代码块的 js-fiddle，我可以为您提供更好的帮助。但下面是一个示例，其中我最初创建了 2 个设置为 null 的输入字段，然后我不断更新我的 ng-model。

<body data-ng-app="formApp">
<div data-ng-controller="FormCtrl">
    <p>
        Name of Topic: <input type="text" data-ng-model="formData.title" placeholder="enter a title" />
    </p>
    Subscribers:
    <button data-ng-click="addSubscriber()">Add subscriber</button>
    <table>
        <tr>
            <th>Name</th>
            <th>Email</th>
        </tr>
        <tr data-ng-repeat="subscriber in formData.subscribers">
            <td><input type="text" data-ng-model="subscriber.name" placeholder="enter name" /></td>
            <td><input type="text" data-ng-model="subscriber.email" placeholder="enter email" /></td>
        </tr>
    </table>
    <hr style="margin:1em 0;" />
    <p>
        <em>Debug info</em>: {{ formData }}
    </p>
</div>

JS如下图。

(function() {
var formApp = angular.module("formApp", []);
formApp.controller("FormCtrl", function ($scope, $timeout) {
    $scope.formData = {};
    $scope.formData.subscribers = [
        { name: null, email: null }
    ];
    $scope.addSubscriber = function() {
        $scope.formData.subscribers.push({ name: null, email: null });
    };
});
})();

让我知道这是否有帮助。

于 2016-08-23T21:36:55.790 回答
1

请在您的 md-dialog 选项中设置 'preserveScope: true' 或.. 我不确定但尝试将您的 ng-model 更改为 ex: "dialogObj.theSentence" 并像这样阅读console.log($scope.dialogObj.theSentence);

于 2016-08-23T20:11:53.410 回答
0

我已经解决了这个问题，在某种程度上，通过将“绑定”数据作为函数的参数传递，而不是让 Angular 绑定来自我调用的 Textfield 的数据，并saveNewSentence()使用theSentence传递给它的参数，例如：saveNewSentence(theSentence). 有效。对我来说似乎是一个便宜的把戏，但是：

如果它很愚蠢并且有效，那么它并不愚蠢

希望这可以帮助其他有类似问题的困惑的灵魂。

于 2016-08-25T00:12:27.900 回答