Javascript 为什么赢了'；这个有角度的ng绑定连接到ng控制器上吗？_Javascript_Html_Angularjs

Javascript 为什么赢了'；这个有角度的ng绑定连接到ng控制器上吗？

javascript html angularjs

Javascript 为什么赢了'；这个有角度的ng绑定连接到ng控制器上吗？,javascript,html,angularjs,Javascript,Html,Angularjs,我正在学习Angular.js。我想制作一个表单，用户可以在那里看到他们填写的输出下面是test.html： <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.0-rc.2/angular.js"></script> <script src="test.js"></script> </head> <body ng-app

我正在学习Angular.js。我想制作一个

表单

，用户可以在那里看到他们填写的输出

下面是

test.html

：

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.0-rc.2/angular.js"></script>
<script src="test.js"></script>
</head>
<body ng-app="charter">
  <div id="layout-wrapper" ng-controller="graphicLanguageCTRL">
        <form id="graphic-language" ng-controller="graphicLanguageCTRL" novalidate>
            <h3>Language</h3>
            <input type="text" name="headline" placeholder="Headline" ng-model="graphic.hed"> <br>
        </form>
  </div>
  <h1 class="graphic-title" ng-bind="graphic.hed"></h1>
</body>

我希望键入

input

标记的内容在

h1

标记中可见。但是当我输入

input

标记时，

h1

标记中没有显示任何内容

如何修复此问题？

您的代码中有一些错误：

您正在控制器外部使用ng bind
您正在初始化两次
```
graphicLanguageCTRL
```
在脚本中，您设置了错误的变量名

以下是固定代码：

html


语言

var-app=angular.module（“charter”，[]）；
app.controller（“graphicLanguageCTRL”，函数（$scope）{
$scope.graphic={
他说：
};
});

您的代码中有一些错误：

您正在控制器外部使用ng bind
您正在初始化两次
```
graphicLanguageCTRL
```
在脚本中，您设置了错误的变量名

以下是固定代码：

html


语言

var-app=angular.module（“charter”，[]）；
app.controller（“graphicLanguageCTRL”，函数（$scope）{
$scope.graphic={
他说：
};
});

或

需要注意的两件事：

不要嵌套和使用相同的
```
ng控制器
```
将
```
h1
```
移动到内部
```
ng控制器
```
块

固定版本：

var-app=angular.module（'charter'，[]）；
app.controller（“graphicLanguageCTRL”，函数（$scope）{
$scope.graphic={
他说：
};
});

测试
语言


2件事需要注意：

不要嵌套和使用相同的ng控制器
将h1移动到内部
ng控制器
块

固定版本：

var-app=angular.module（'charter'，[]）；
app.controller（“graphicLanguageCTRL”，函数（$scope）{
$scope.graphic={
他说：
};
});

测试
语言


将代码减少到所需的最小值，并添加一些注释以使问题更有用。将代码减少到所需的最小值，并添加一些注释以使问题更有用。
var app=    angular.module("charter",[]);
app.controller("graphicLanguageCTRL",function($scope){
    $scope.master=  {
        hed: ''
    };
});

<body ng-app="charter">
  <div id="layout-wrapper" ng-controller="graphicLanguageCTRL">
    <form id="graphic-language" novalidate>
      <h3>Language</h3>
      <input type="text" name="headline" placeholder="Headline" ng-model="graphic.hed"> <br>
    </form>
    <h1 class="graphic-title" ng-bind="graphic.hed"></h1>
  </div>
</body>

var app = angular.module("charter",[]);

app.controller("graphicLanguageCTRL", function($scope){
  $scope.graphic = {
    hed : ''
  };
});

var app = angular.module("charter",[]);
app.controller("graphicLanguageCTRL",function($scope){
    $scope.graphic = {
        hed: ''
    };
});

var app = angular.module("charter",[]);
app.controller("graphicLanguageCTRL",function($scope){
    $scope.graphic = {};
    $scope.graphic.head = ''
});