javascript - 如何向这个 Angular JS 应用程序添加编辑事件？

Question

拜托，我有这段代码，但我不知道如何添加编辑事件和按钮。请问有什么帮助吗？

<script>
  var firstApp = angular.module('firstApp', []);
  firstApp.controller('FirstController', function($scope) {
    $scope.toic = '';
    $scope.discussion = '';
    $scope.updateMessage = function() {
      $scope.heading = $scope.topic;
      $scope.body = $scope.discussion;
    };
  });
</script>
<input ng-model="topic">
<input ng-model="discussion">
<button ng-click="updateMessage()">click<button>

<div>
{{heading}} 
{{Body}}
</div>

Answer 1

您已经很接近了，但有一些拼写错误和丢失的信息导致此功能无法正常工作:

1) 您需要将 HTML 包装在具有 ng-app 的元素中和ng-controller属性使 Angular 知道哪个模块/ Controller 用于绑定(bind)中的逻辑。

2) $scope.toic应该是$scope.topic

3) {{Body}}应该是{{body}}

4) <button ...><button>应该是<button ...></button> (结束标签上缺少 /)

var firstApp = angular.module('firstApp', []);
firstApp.controller('FirstController', function($scope) {
  $scope.topic = '';
  $scope.discussion = '';
  $scope.updateMessage = function() {
    $scope.heading = $scope.topic;
    $scope.body = $scope.discussion;
  };
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="firstApp" ng-controller="FirstController">
  <input ng-model="topic">
  <input ng-model="discussion">
  <button ng-click="updateMessage()">click</button>

  <div>{{heading}} 
  {{body}} </div>
</div>