Провайдеры, ChangeDetection, Encapsulations, определения узлов в угловых компонентах

Question

Я вижу некоторые пакеты, в которых они дают провайдерам , инкапсуляции , changeDetections , host в качестве следующего фрагмента кода. Что они означают и как они ведут себя в классе компонентов по отношению к следующему коду.

@Component({
    selector: 'ng-select',
    templateUrl: './ng-select.component.html',
    styleUrls: ['./ng-select.component.scss'],
    providers: [{
        provide: NG_VALUE_ACCESSOR,
        useExisting: forwardRef(() => NgSelectComponent),
        multi: true
    }],
    encapsulation: ViewEncapsulation.None,
    changeDetection: ChangeDetectionStrategy.OnPush,
    host: {
        'role': 'listbox',
        'class': 'ng-select',
        '[class.ng-select-single]': '!multiple',
    }
})

Answer 1

Это означает следующее:

• инкапсуляция, если вы используете ViewEncapsulation.None, это означает, что стили, которые вы напишете либо в атрибуте styles, либо в styleUrl: (файл css), будут глобальной областью действия,так что если у вас есть

  .danger {color: red}, вы можете использовать этот стиль также вне компонента

• host означает, что вы добавляете свойства к самому элементу host, дляНапример, в этом случае будут добавлены следующие свойства

  ng-select role class = "ng-select" \

• поставщики означают, что службы, которые вы добавляете туда,будут доступны только на уровне компонентов, и если у вас есть два разных ng-select, у обоих будут разные экземпляры этого класса

• обнаружение изменений, вы можете настроить, как на этом работает обнаружение измененийкомпонент, по умолчанию при каждом цикле обнаружения изменений будет запускаться и этот компонент, стратегия OnPush означает, что он будет запускать обнаружение изменений на этом компоненте только в том случае, если какая-либо из входных опорколичество ссылок было изменено