绑定表达式：未定义标识符
[英]Binding Expression: Identifier is not defined
问题描述
I am new to Angular and I am learning the basics of binding expressions.
我是 Angular 的新手，我正在学习绑定表达式的基础知识。 While trying to implement a new module, I keep getting an error in my html file saying that the identifier is not defined.在尝试实现新模块时，我的 html 文件中不断出现错误，指出标识符未定义。 How do I get rid of this error?我如何摆脱这个错误？
"Identifier 'message' is not defined. The component declaration, template variable declarations, and element references do not contain such a memberAngular " “标识符'message'未定义。组件声明、模板变量声明和元素引用不包含这样的成员Angular”
I am using Visual Studio Code 1.38.1 and Angular 8.2.6;我使用的是 Visual Studio Code 1.38.1 和 Angular 8.2.6； I have already tried placing the script references in the head and different parts in the body;我已经尝试将脚本引用放在头部和身体的不同部分； tried changing the name of the module, using single and double quotes, and modifying the controller instance.尝试更改模块的名称，使用单引号和双引号，并修改控制器实例。 One thing that removes the error is putting the property in the app.component.ts file;消除错误的一件事是将属性放入 app.component.ts 文件中； but still, I want it to be the module since no one else gets a similar problem.但是，我仍然希望它成为模块，因为没有其他人遇到类似的问题。 I don't understand what I'm doing wrong and no tutorial that I have seen addresses this issue.我不明白我做错了什么，我看过的教程也没有解决这个问题。
In the script.js file:在 script.js 文件中：
<reference path="angular.min.js" />
var myApp = angular.module("module1", []);
myApp.controller("myController", function($scope){
$scope.message = "hello from the controller";
});
In the app.component.html file:在 app.component.html 文件中：
...
<body>
<div ng-controller="module1">
<p>{{ message }}</p>
</div>
</body>
...
In the app.component.ts file:在 app.component.ts 文件中：
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'proj1';
message = 'hello';
}
2 个解决方案
解决方案1
0 2019-09-17 13:11:44
remove script.js and put HTML code in app.component.html删除 script.js 并将 HTML 代码放入 app.component.html
<body>
<div>
<p>{{ message }}</p>
</div>
</body>
You're using AngularJS strategy.您正在使用 AngularJS 策略。 Try to read Angular Docs and follow it.尝试阅读 Angular Docs 并遵循它。
解决方案2
0 2019-10-30 12:56:40
You are confusing angular js (v 1, 1+) with Angular (2, 2+).您将 angular js (v 1, 1+) 与 Angular (2, 2+) 混淆了。
The Angular Js uses the ng-controller for attaching controller and data-binding to view. Angular Js 使用ng-controller将控制器和数据绑定附加到视图。 But in Angular, the components are used for view and data-binding happens from component while AppModule or feature module holds all modules and includes them in app:但是在 Angular 中，组件用于视图和数据绑定发生在组件中，而 AppModule 或功能模块包含所有模块并将它们包含在应用程序中：
You can just use : <p>{{ message }}</p> for binding data.您可以只使用 : <p>{{ message }}</p>来绑定数据。
See this link for a basic example有关基本示例，请参阅此链接
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.