Angular JS似乎没有工作,新手

时间:2014-02-13 12:43:45

标签: angularjs

我从net获得了一个示例应用程序,我试图实现,但它似乎不起作用,下面是应用程序的代码,请帮我修复它并建议我如何让它更好。我是Angular的新手。

Jsfiddle:http://jsfiddle.net/eGzZg/

<div id="main" ng-controller="contactDetails">
      <label>Name</label>
      <input type="text" name="name" ng-model="newcontact.name"/>
      <label>Email</label>
      <input type="text" name="email" ng-model="newcontact.email"/>
      <label>Phone No</label>
      <input type="text" name="phno" ng-model="newcontact.phno"/>
      <input type="hidden" ng-model="newcontact.id" />
      <input type="button" value="Save" ng-click="saveContact()" />
  <div id="table">
    <div id="thead">
      <span>Name</span>
      <span>Email</span>
      <span>Phone No</span>
      <span>Action</span>
    </div>
    <div id="tbody" ng-repeat="contact in contacts">
      <span> {{contact.name}}  </span>
      <span> {{contact.email}} </span>
      <span> {{contact.phno}}  </span>
      <span> <a href='#' ng-click="edit(contact.id)">Edit</a></span>
      <span> <a href='#' ng-click="delete(contact.id)">Delete</a></span>
    </div>
  </div> 
</div>


<script>
var uid = 0;
function contactDetails($scope) {
  //$scope.contacts = [{ id : null, 'name':null, 'phno':null }];
  $scope.contacts = [
        { id:0, 'name': 'Viral', 
          'email':'hello@gmail.com', 
          'phno': '123-2343-44'
        }
    ];
  $scope.saveContact = function(){
    alert('sd');  
    for( i in $scope.contacts){
      if($scope.contacts[i].id == $scope.newcontact.id || ($scope.contacts[i].name == $scope.newcontact.name && $scope.contacts[i].phno == $scope.newcontact.phno)){
        $scope.contacts[i] = $scope.newcontact;
      }else{
        $scope.contacts.id = ++uid;
        $scope.contacts.push($scope.newcontact); 
      }
      $scope.newcontact = {};
    } 
  }
}
</script>

2 个答案:

答案 0 :(得分:1)

不要忘记实际包含角度,也忘了ng-app

<body ng-app>

here ya go

答案 1 :(得分:0)

只需更改$scope.contacts = [{ id : null, 'name':null, 'phno':null }];

即可

$scope.contacts = [];

即使您将联系人元素的属性设置为null,它仍然只有一个元素,这也就是为什么没有文本,但是在加载页面时会出现按钮。