我想使用angular 1.5的component()方法。然而，在同一个 DOM 元素上应用不同的组件似乎是不可能的。这是因为无论我如何在 component() 调用中设置隔离属性，都会创建一个新范围，从而导致错误消息：
[$compile:multidir] 多个指令 [...] 要求新的/隔离的范围
这并不奇怪，因为 component() 定义范围创建是这样的：
scope: options.isolate === false ? true : {}
所以我的问题是：这是一个错误还是通常不支持在一个 DOM 元素上拥有多个组件？我知道我可以使用directive()，但考虑到Angular 2 迁移，我宁愿将所有内容移至component()。
【问题讨论】：
标签： javascript angularjs
范围属性可以是
true，一个对象或一个假值：
falsy：不会为指令创建范围。该指令将使用其父级的作用域。
true: 将为
指令的元素。如果同一元素上的多个指令请求新范围，
仅创建一个新范围。新的范围规则不适用于模板的根
因为模板的根总是有一个新的范围。
{...}（对象哈希）：为指令的元素创建了一个新的“隔离”范围。这
'isolate' 作用域与普通作用域的不同之处在于它在原型上并不从其父级继承
范围。这在创建可重用组件时很有用，不应意外读取或修改
父范围内的数据。
来自文档：
一般来说，可以将多个指令应用于一个元素，但根据指令所需的范围类型，可能会有一些限制。以下几点将有助于解释这些限制。为简单起见，只考虑了两个指令，但它也适用于多个指令：
- 无作用域 + 无作用域 => 两个不需要自己作用域的指令将使用其父作用域
- 子范围 + 无范围 => 两个指令将共享一个子范围
- 子范围 + 子范围 => 两个指令将共享一个子范围
- 隔离范围 + 无范围 => 隔离指令将使用它自己创建的隔离范围。另一个指令将使用 其父级范围
- 独立作用域 + 子作用域 => 不起作用！一个元素只能关联一个作用域。因此这些指令不能 应用于相同的元素。
- 独立作用域 + 孤立作用域 => 不起作用！一个元素只能关联一个作用域。因此这些指令 不能应用于同一个元素。
-- AngularJS $compile Service API Reference -- scope
这是 AngularJS 博客对组件的评价：
module.component
我们创建了一种更简单的注册组件指令的方法。从本质上讲，组件是一种特殊的指令，它们绑定到一个自定义元素（类似于<my-widget></my-widget>），具有关联的模板和一些绑定。现在，通过使用 AngularJS 1.5 中的 .component() 方法，您可以用很少的代码行创建一个可重用的组件：
var myApp = angular.module("MyApplication", [])
myApp.component("my-widget", {
templateUrl: "my-widget.html",
controller: "MyWidgetController",
bindings: {
title: "="
}
});
要了解有关 AngularJS 1.5 组件方法的更多信息，请阅读 Todd Motto 的文章： http://toddmotto.com/exploring-the-angular-1-5-component-method/
-- http://angularjs.blogspot.com/2015/11/angularjs-15-beta2-and-14-releases.html
【讨论】：
@Directive 装饰器。
在上面的答案和cmets的帮助下，我得出了以下结论：
component() 不支持创建没有新范围的组件。这只能通过使用指令来完成（也在 Angular 2 中）。
【讨论】：