Question

我想创建一个可以被其他视图重用的控制器。（此控制器将用作模板）

问题在于我无法进行简单的验证，因为它无法读取ng-model中设置的属性，除非我对某个字段进行了更改，然后该属性将被添加那个对象。

我不想将ng-init="object.fieldName = null"放在我看来的每个字段中，因为我认为这不是一个好习惯。我尝试使用$watch，但对象仍然等于{}

这是我的控制器：

angular.module('practiceApp')
.controller("CreateModalController", function($scope, items, defaultService) {

    function initialize() {
        $scope.object = {}; // <---- this should contain the ng-model object properties
        $scope.defaultService = defaultService;
        $scope.modalTitle = items.modalTitle;

        $scope.$watch('object', function(newValue, oldValue) {
            console.log(newValue);
        }, true);
    }

    initialize();

});

以下是我的观点：

<form name = "objectForm"
      role = "form">
      <input type="text" 
             ng-model="object.firstName" 
             class="form-control"
             placeholder="First Name" 
             ng-class="{'error-textfield': defaultService.isNotValid(object.firstName)}"
             required>

      <input type="text" 
             ng-model="object.lastName" 
             class="form-control"
             placeholder="Last Name" 
             ng-class="{'error-textfield': defaultService.isNotValid(object.lastName)}"
             required>
</form>

当前输出=＆gt; object: {}

期望的输出=＆gt; object: {firstname: undefined, lastName: undefined}

Answer 1

输出最初为Display.cpp:(.text+0x8a): undefined reference to `SDL_Init'，因为您最初没有声明object: {}有任何属性。当您在$scope.object中输入文字以触发firstName更新lastName时，它只会显示<input>或ng-model属性。

如果你想让它最初展示出你所提供的所需输出，最初在控制器中声明你的对象有未定义的属性：

$scope.object

另外，如果您已经在路由中声明了控制器，则不应该通过控制器中的$scope.object = { firstName: undefined, lastName: undefined };功能进行自我初始化。

此外，如果您使用的是AngularJS 1.5+组件，则可以使用initialize()。

Answer 2

见工作代码：

＆＃13;

<!DOCTYPE html>
<html>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<script>
  
  
  var app = angular.module('practiceApp', []);
  app.controller("CreateModalController", function($scope) {

    function initialize() {
        $scope.object = {
          firstName: null,
          lastName: null
        }; // <---- this should contain the ng-model object properties
        //$scope.defaultService = defaultService;
        //$scope.modalTitle = items.modalTitle;

        $scope.$watch('object', function(newValue, oldValue) {
            console.log(newValue);
        }, true);
    }

    initialize();

});
  
  
</script>
<div ng-app="practiceApp" ng-controller="CreateModalController">
<form name="objectForm"
      role="form">
      <input type="text" 
             ng-model="object.firstName" 
             class="form-control"
             placeholder="First Name" 
             ng-class="{'error-textfield': defaultService.isNotValid(object.firstName)}"
             required>

      <input type="text" 
             ng-model="object.lastName" 
             class="form-control"
             placeholder="Last Name" 
             ng-class="{'error-textfield': defaultService.isNotValid(object.lastName)}"
             required>
  
</form>
  </div>
</body>
</html>

＆＃13;

即使您不想初始化值，您也会在开始输入后看到firstName和lastName的值。当用户不在输入字段中输入任何内容时，对象＆＃39;中没有值。所以没有什么可以展示的。

有问题吗？

AngularJS - Controller无法读取ng-model对象属性

2 个答案: