Question

是否可以在不使用模板或@View？

的情况下使用Angular 2

我正在寻找与您在示例中执行以下操作类似的方式：

Angular 1

的index.html

angular.module('app', []).controller('appcontroller', function(){
$scope.isActive = function(){
    return true;
}
});

app.js

<app>
<div [ngclass]="{active: isActive()}">
    .....
</div>
</app>

如果可能的话，我猜它会看起来像这样：

Angular 2

的index.html

import {Component} from 'angular2/core';
@Component({
selector: 'app'
})
export class AppComponent { 
isActive(){
    return true;
}
}

app.ts

... must have either 'template', 'templateUrl', or '@View' set.

但不幸的是我收到了错误：

lxml

我不喜欢将html放在Javascript中，所以我希望有某种解决方法或方法来实现这一点。

Answer 1

事实上，您应该像这样实施AppComponent：

import {Component} from 'angular2/core';

@Component({
  selector: 'app'
  template: `
    <div [ngClass]="{active: isActive()}">
      .....
    </div>
  `
})
export class AppComponent { 
  isActive(){
    return true;
  }
}

或使用templateUrl属性：

import {Component} from 'angular2/core';

@Component({
  selector: 'app'
  templateUrl: 'component.html'
})
export class AppComponent { 
  isActive(){
    return true;
  }
}

并使用这样的组件：

<app></app>

如果您在app标记内放置了一些HTML，则表示您希望使用ng-content向组件提供一些内容，这些内容可以包含在组件模板中。以下是一个示例：Angular 2 Template Component。

希望它可以帮到你，亨利

Angular 2组件没有视图

1 个答案: