无法在Angular 5中使用ng-include [英] Unable to use ng-include in angular 5

问题描述

对于Angular来说还很新，并且使用Angular 5和Visual Code进行了一个小型试验项目.我正在尝试使用ng-include，但模板没有显示.

Pretty new to Angular and doing a small pilot project using Angular 5 and Visual Code. I am trying to use ng-include and the template doesn't get displayed.

  src
     add-device
        add-device.component.html
        add-device.component.scss
        add-device.component.spec.ts
        add-device.component.ts
     edit-device
        edit-device.component.html
        edit-device.component.scss
        edit-device.component.spec.ts
        edit-device.component.ts
     templates
        device.html
     app.module.ts
     app.coponent.ts
     app.component.html
     ....

简单的device.html代码

simple device.html code

<div>Include is working!</div>

add-device.component.html

add-device.component.html

<div ng-include="" src="'templates/device.html'">
    <div>More unique elements here!</div>
</div>

我也尝试关注

<div ng-include="" src="'templates/device.html'"></div>

<div ng-include="'templates/device.html'"></div>

以下给出了错误，无法识别ng-include.

Following gives error, ng-include is not recognized.

<ng-include src="'templates/device.html'"></ng-include>

目标是使用添加和编辑设备组件中的device.html模板代码.我正在使用打字稿来管理项目.当我在调试器中查看Sources时，我什至没有在Source列表中看到device.html文件.

Objective is to use device.html template code from both add and edit device components. I am using typescript to manage the project. When i look at the Sources in debugger, i do not even see device.html file in source list.

推荐答案

Angular没有AngularJS以前的ng-include.

Angular doesn't have a ng-include as AngularJS used to have.

在Angular中，您可以创建这样的组件:

In Angular, you can create a component like this:

@Component({
    selector: 'app-device',
    templateUrl: './device.html'
})
class DeviceComponent {}

然后，而不是:

<div ng-include="'templates/device.html'">

您这样做:

<app-device></app-device>

这篇关于无法在Angular 5中使用ng-include的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！