Question

这是我的代码：

＆＃13;

App.getRequestQueue().add(jsonRequest);

＆＃13;

这是我的剧本

＆＃13;

<form class="form-horizontal" 
  name="commentForm"
  ng-submit="submitComment()" 
  novalidate>
  <div class="form-group" 
   ng-class="{ 'has-error has-feedback' : commentForm.name.$invalid && !commentForm.name.$pristine }">
<label for="name" class="col-sm-2 control-label">Your name</label>
<div class="col-sm-10">
  <input type="text" 
         name="name" 
         class="form-control" 
         placeholder="your name" 
         ng-model="comment.name" 
         id="name">
  <span class="help-block" 
        ng-show="commentForm.name.$error.required && !commentForm.name.$pristine">
    Name required
  </span>
</div>
  </div>

  <div class="form-group">
<label for="radio" class="col-sm-2 control-label" > Rating </label>
  <div class="col-sm-10">
    <label class="radio-inline" ng-repeat="star in stars">
    <input type="radio" name="star.value" 
           ng-value="{{star.value}}" 
           ng-model="comment.rating" 
           ng-checked="isSelected(star.value)">
    {{star.value}}
  </label>
</div>
  </div>
  
  <div class="form-group" ng-class="{'has-error has-feedback':comment.textComments.$error.required && !comment.textComments.$pristine}">
<label for="name" class="col-sm-2 control-label">Your comments</label>
<div class="col-sm-10">
  <textarea  rows="12" class="form-control" name="textComments" id="comments" ng-model="comment.textComments" placeholder="your comments">
  </textarea>
  <span class="help-block" ng-show="comment.textComments.$error.required && !comment.textComments.$pristine">comments Required</span>
</div>
  </div>

  <div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
  <button type="submit" class="btn btn-primary" ng-disabled="commentForm.$invalid">Submit</button>
</div>
  </div>
</form>

＆＃13;

请有人帮我这个

Answer 1

您在输入字段中缺少'required'属性，并且您正在尝试访问未定义对象'$ scope.dish.comments'的属性。

见下面的代码：

(function() {
  'use strict';
  angular.module('app', []).controller('DishCommentController', DishCommentController);

  function DishCommentController($scope) {
    var stars = [{
        value: "1"
      }, {
        value: "2"
      }, {
        value: "3"
      }, {
        value: "4"
      }, {
        value: "5"

      }

    ];
    $scope.isSelected = function(checkStar) {
      console.log(checkStar == 5);
      return checkStar == 5;
    };

    $scope.stars = stars;

    //select default values here
    $scope.comment = {
      name: "",
      rating: 4,
      textComments: "",
      date: ""
    };

    $scope.submitComment = function() {
      $scope.comment.date = new Date().toISOString();
      // Step 3: Push your comment into the dish's comment array
      // $scope.dish.comments.push("Your JavaScript Object holding the comment");
    };
  }


})();

<!DOCTYPE html>
<html ng-app="app">

<head>
  <script data-require="angularjs@1.5.5" data-semver="1.5.5" src="https://code.angularjs.org/1.5.5/angular.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body ng-controller="DishCommentController">

  <form name="commentForm" ng-submit="submitComment()" novalidate>
    <div class="form-group">
      <label for="name">Your name</label>
      <div>
        <input type="text" name="name" class="form-control" placeholder="your name" ng-model="comment.name" id="name" required>
        <span class="help-block" ng-show="commentForm.name.$error.required && !commentForm.name.$pristine">Name required</span>
      </div>
    </div>
    <div class="form-group">

      <label for="radio" class="col-sm-2 control-label">Rating</label>

      <div class="col-sm-10">
        <label class="radio-inline" ng-repeat="star in stars">
          <input type="radio" name="star.value" ng-value="{{star.value}}" ng-model="comment.rating" ng-checked="isSelected(star.value)">{{star.value}}
        </label>
      </div>


    </div>
    <div class="form-group">
      <label for="name" class="col-sm-2 control-label">Your comments</label>
      <div class="col-sm-10">
        <textarea rows="12" class="form-control" name="textComments" id="comments" ng-model="comment.textComments" required placeholder="your comments">
        </textarea>
        <span class="help-block" ng-show="comment.textComments.$error.required && !comment.textComments.$pristine">comments Required</span>
      </div>
    </div>
    <div class="form-group">
      <div class="col-sm-offset-2 col-sm-10">
        <button type="submit" class="btn btn-primary" ng-disabled="commentForm.$invalid">Submit</button>
      </div>
    </div>

  </form>
</body>

</html>

angularjs验证和单选按钮默认选择不起作用

1 个答案: