zoukankan      html  css  js  c++  java
  • [Angular] Difference between Providers and ViewProviders

    For example we have a component:

    class TodoList {
      private todos: Todo[] = [];
    
      add(todo: Todo) {}
    
      remove(todo: Todo) {}
    
      set(todo: Todo, index: number) {}
    
      get(index: number) {}
    
      getAll() {}
    }
    
    @Component({
      // ...
      viewProviders: [TodoList]
      // ...
    })
    class TodoAppComponent {
      constructor(private todos: TodoList) {}
      // ...
    }

    For TodoAppComponent, we make 'TodoList' as 'viewProviders'. 

    And inside TodoAppComponent, we have TodoInputComponent & TodoComponent as view children, and AppFooterComponent as content child:

    @Component({
      selector: 'todo-app',
      template: `
        <section>
          Add todo:
          <todo-input (todo)="addTodo($event)"></todo-input>
        </section>
        <section>
          <h4 *ngIf="todos.getAll().length">Todo list</h4>
          <todo *ngFor="let todo of todos.getAll()" [todo]="todo">
          </todo>
        </section>
        <ng-content select="app-footer"></ng-content>
      `
    })

    So now, if we want to inject TodoList into TodoInputComponent and TodoComponent, that's fine. But once we try to inject TodoList service into FooterComponent, it will show the error:

    ORIGINAL EXCEPTION: No provider for TodoList!

    This is because when we use 'viewProviders' we can only inject service into component and its view children. Content Children (passed in by ng-content) cannot be injected.

    When to use viewProviders?

    Why would I use viewProviders, if such providers are not accessible by the content children of the component? Suppose you’re developing a third-part library, which internally uses some services. These services are part of the private API of the library and you don’t want to expose them to the users. If such private dependencies are registered with providers and the user passes content children to any of the components exported by the public API of your library, she will get access to them. However, if you use viewProviders, the providers will not be accessible from the outside.

  • 相关阅读:
    BZOJ4821 SDOI2017相关分析(线段树)
    BZOJ3167/BZOJ4824 HEOI2013SAO/CQOI2017老C的键盘(树形dp)
    BZOJ4820 SDOI2017硬币游戏(概率期望+高斯消元+kmp)
    BZOJ4811 Ynoi2017由乃的OJ(树链剖分+线段树)
    BZOJ4810 Ynoi2017由乃的玉米田(莫队+bitset)
    Codeforces Round #522 Div. 1 没打记
    BZOJ4784 ZJOI2017仙人掌(树形dp+dfs树)
    43. Multiply Strings
    2. Add Two Numbers
    150. Evaluate Reverse Polish Notation
  • 原文地址:https://www.cnblogs.com/Answer1215/p/6417951.html
Copyright © 2011-2022 走看看