form。$ valid总是返回false angularjs

时间:2016-01-26 17:04:27

标签: angularjs angular-meteor

我正在尝试在ng-repeat中对我的表单进行验证,即使所有输入都已填充且正确,现在也总是返回false。

这是我的更新功能:

$scope.updateChannel = function (channel) {
  if (channelForm.$valid) {
    Channels.update({
      _id: channel._id
    }, {
      $set: {
        name: channel.name,
        category: channel.category,
        tags: channel.tags,
        logo: channel.logo
      }
    }, function (error, data) {
      if (error) {
        console.log('unable to update the channel: ' + error);
      } else {
        console.log('Done! ' + data);
      }
    });
  } else {
    console.log('fix errors');
  }
}

这是我的表格:

<form ng-show="channel.edit == true" name="channelForm" ng-submit="updateChannel(channel)" novalidate>
  <md-input-container>
    <label for="name">Nombre</label>
    <input type="text" name="name" ng-model="channel.name" md-maxlength="20" required>
    <div ng-messages="channelForm.name.$error;">
      <div ng-message="required">Esto es requerido.</div>
      <div ng-message="md-maxlength">Demaciados carácteres.</div>
    </div>
  </md-input-container>

  <md-input-container class="md-block">
    <label for="category">Categorias</label>
    <md-select name="category" ng-model="channel.category" multiple required>
      <md-option ng-repeat="kit in kits" value="{{kit.name}}">{{kit.name}}</md-option>
    </md-select>
    <div class="errors" ng-messages="channelForm.category.$error">
      <div ng-message="required">Esto es requerido.</div>
    </div>
  </md-input-container>

  <md-input-container>
    <label for="number">Canal</label>
    <input type="number" name="number" ng-model="channel.number" ng-model-options="{ updateOn: 'blur' }" maxlength="5" required>
    <div ng-messages="channelForm.number.$error;">
      <div ng-message="required">Esto es requerido.</div>
      <div ng-message="md-maxlength">Demaciados carácteres.</div>
    </div>
  </md-input-container>

  <md-input-container>
    <label for="tags">Tags(separar con espacio)</label>
    <input type="text" name="tags" ng-model="channel.tags" md-maxlength="20" required>
    <div ng-messages="channelForm.tags.$error;">
      <div ng-message="required">Esto es requerido.</div>
      <div ng-message="md-maxlength">Demaciados carácteres.</div>
    </div>
  </md-input-container>

  <md-input-container>
    <label for="logo">Logo</label>
    <input type="text" name="logo" ng-model="channel.logo" required>
    <div ng-messages="channelForm.logo.$error;">
      <div ng-message="required">Esto es requerido.</div>
    </div>
  </md-input-container>

  <md-button type="submit" class="md-raised md-primary" ng-click="channel.edit = false" ng-disabled="channelForm.$invalid">Guardar</md-button>
  <md-button class="md-raised" ng-click="channel.edit = false">Cancelar</md-button>
  <md-button class="md-raised md-warn" ng-click="removeChannel(channel)">Borrar</md-button>
</form>

现在这是ng-repeat="channel in channels",所以我不确定这是不是问题。

此外,所有ng-messages似乎都正常工作,即使它们都没有显示我仍然无法更新文档。

我在这里做错了什么?

谢谢!

1 个答案:

答案 0 :(得分:0)

如果这是ng-repeat,你最终会得到一堆名为channelForm

的表格

您可以在表单标记上放置一个新控制器,并在该控制器中移动updateChannel