คำถามติดแท็ก angular

ฉันกำลังใช้ Angular 2 โดยปกติแล้วเราจะใช้@Output() addTab = new EventEmitter<any>();แล้วaddTab.emit()ปล่อยเหตุการณ์ไปยังองค์ประกอบหลัก มีวิธีใดบ้างที่เราสามารถทำได้รองลงมาจากรุ่นแม่สู่รุ่นลูก?

114 angular  typescript 

ฉันพยายามทำให้การmat-tableเรียงลำดับทำงานในเครื่องและในขณะที่ฉันสามารถรับข้อมูลให้แสดงได้ตามที่คาดไว้การคลิกที่แถวส่วนหัวจะไม่ทำการเรียงลำดับเหมือนในตัวอย่างออนไลน์ (ไม่มีอะไรเกิดขึ้นเลย) ฉันกำลังพยายามทำให้การสาธิตนี้ทำงานในเครื่อง: https://material.angular.io/components/sort/overview https://plnkr.co/edit/XF5VxOSEBxMTd9Yb3ZLA?p=preview ฉันได้สร้างโปรเจ็กต์ใหม่ด้วย Angular CLI แล้วทำตามขั้นตอนต่อไปนี้: https://material.angular.io/guide/getting-started นี่คือไฟล์ในเครื่องของฉัน: app.module.ts import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { MatSort, MatTableModule } from '@angular/material'; import { AppComponent } from './app.component'; import { TableSortingExample } from './table-sorting-example'; @NgModule({ declarations: [ AppComponent, TableSortingExample, MatSort ], …

114 angular  angular-material 

รหัสของฉัน: <li *ngFor="let item of list; let i=index" class="dropdown-item" (click)="onClick(item)"> <template [ngIf]="i<11">{{item.text}}</template> </li> ฉันพยายามให้แสดงองค์ประกอบรายการเพียง 10 รายการ ณ เวลาใดก็ได้ ตามที่แนะนำในคำตอบที่นี่ฉันใช้ ngIf แต่ผลลัพธ์นี้ทำให้รายการว่าง (เกิน 10) ปรากฏบนหน้า

114 angular 

ฉันมีองค์ประกอบหลักที่ไปที่เซิร์ฟเวอร์และดึงวัตถุ: // parent component @Component({ selector : 'node-display', template : ` <router-outlet [node]="node"></router-outlet> ` }) export class NodeDisplayComponent implements OnInit { node: Node; ngOnInit(): void { this.nodeService.getNode(path) .subscribe( node => { this.node = node; }, err => { console.log(err); } ); } และในหนึ่งในจอแสดงผลของเด็ก ๆ : export class ChildDisplay implements OnInit{ …

114 angular  dependency-injection  angular2-routing 

ฉันพยายามใช้disabledแอตทริบิวต์จากไฟล์formControl. เมื่อฉันใส่ลงในเทมเพลตมันใช้งานได้: <md-input formControlName="id" placeholder="ID" [disabled]="true"></md-input> แต่เบราว์เซอร์แจ้งเตือนฉัน: ดูเหมือนว่าคุณกำลังใช้แอตทริบิวต์ที่ปิดใช้งานกับคำสั่งรูปแบบปฏิกิริยา หากคุณตั้งค่าปิดใช้งานเป็นจริงเมื่อคุณตั้งค่าการควบคุมนี้ในคลาสคอมโพเนนต์ของคุณแอตทริบิวต์ที่ปิดใช้งานจะถูกตั้งค่าใน DOM ให้คุณ เราขอแนะนำให้ใช้แนวทางนี้เพื่อหลีกเลี่ยงข้อผิดพลาด "เปลี่ยนแปลงหลังจากตรวจสอบแล้ว" Example: form = new FormGroup({ first: new FormControl({value: 'Nancy', disabled: true}, Validators.required), last: new FormControl('Drew', Validators.required) }); ดังนั้นฉันจึงใส่ไว้ในFormControlและลบออกจากเทมเพลต: constructor(private itemsService: ItemsService) { this._items = []; this.myForm = new FormGroup({ id: new FormControl({value: '', disabled: true}, Validators.required), title: …

114 angular  typescript 

ฉันเป็นนักพัฒนาแบ็กเอนด์และฉันแค่เล่นกับ Angular4 ดังนั้นผมจึงไม่ได้ติดตั้งการกวดวิชานี้: https://www.youtube.com/watch?v=cdlbFEsAGXo ด้วยเหตุนี้ฉันจะเพิ่ม bootstrap ลงในแอปได้อย่างไรเพื่อให้ฉันสามารถใช้คลาส "container-fluid" หรือ "col-md-6" และอะไรทำนองนั้นได้

113 twitter-bootstrap  angular 

ฉันรู้ว่าในangular2ฉันสามารถปิดการใช้งานปุ่มที่มี [disable]แอตทริบิวต์ตัวอย่างเช่น: <button [disabled]="!isValid" (click)="onConfirm()">Confirm</button> แต่ฉันสามารถทำได้โดยใช้[ngClass]หรือ[ngStyle]? ชอบมาก: <button [ngStyle]="{disabled : !isValid}" (click)="onConfirm()">Confirm</button> ขอบคุณ.

113 html  angular  angular2-template  angular2-forms 

คุณตรวจจับเหตุการณ์ onBlur ใน Angular2 ได้อย่างไร? ฉันต้องการใช้กับ <input type="text"> ใครสามารถช่วยฉันเข้าใจวิธีการใช้งาน

113 javascript  angular  onblur 

RE: Angular2 2.0.0, angular-cli v1.0.0-beta.11-webpack.8 ฉันจะบอก angular-cli ให้รวมไฟล์จาก "src / assets" ในรูทของ "dist" ได้อย่างไรเมื่อสร้าง เราปรับใช้กับโฮสต์ Windows และจำเป็นต้องรวมไฟล์ "web.config" เพื่อบอกให้ IIS กำหนดเส้นทางทุกอย่างไปยังดัชนี เรากำลังทำ RC4 ก่อนหน้านี้ แต่ด้วยการอัปเดตทั้งหมดมันล้มเหลว (ฉันจำไม่ได้ว่าเราทำอย่างไร) ฉันได้กำจัดเอกสาร repo ของ GitHubและไม่พบสิ่งใดที่เกี่ยวข้องกับหัวข้อนี้ บางทีฉันอาจจะผิดที่? ในToCมีสัญลักษณ์แสดงหัวข้อย่อย "การเพิ่มไฟล์พิเศษในบิลด์" แต่ดูเหมือนว่าไม่มีส่วนนั้น

113 angular  angular-cli 

เราได้ทำการตั้งค่าโครงการ angular2 หนึ่งโครงการและภายในนั้นสร้างหนึ่งโมดูล (my-module) และภายในโมดูลนั้นได้สร้างส่วนประกอบหนึ่ง (my-new-component) โดยใช้คำสั่ง cmd ต่อไปนี้: ng new angular2test cd angular2test ng g module my-module ng generate component my-new-component หลังจากสร้างการตั้งค่าและส่วนประกอบทั้งหมดเราเรียกใช้ng testคำสั่งจาก cmd ภายในโฟลเดอร์ angular2test ไฟล์ด้านล่างนี้คือไฟล์ my-new-component.component.ts ของเรา : import { Component, OnInit } from '@angular/core'; import { Router, Routes, RouterModule } from '@angular/router'; import { DummyService } …

113 unit-testing  angular  karma-jasmine  angular2-routing  angular-cli 

ฉันรู้วิธีเพิ่มเหตุการณ์ด้วย EventEmitter ฉันยังสามารถแนบเมธอดที่จะเรียกได้หากฉันมีส่วนประกอบดังนี้: <component-with-event (myevent)="mymethod($event)" /> เมื่อฉันมีส่วนประกอบเช่นนี้ทุกอย่างก็ทำงานได้ดี ฉันย้ายตรรกะบางอย่างไปเป็นบริการและฉันจำเป็นต้องยกเหตุการณ์จากภายในบริการ สิ่งที่ฉันทำคือ: export class MyService { myevent: EventEmitter = new EventEmitter(); someMethodThatWillRaiseEvent() { this.myevent.next({data: 'fun'}); } } ฉันมีส่วนประกอบที่ต้องอัปเดตค่าบางอย่างตามเหตุการณ์นี้ แต่ดูเหมือนจะไม่สามารถใช้งานได้ สิ่งที่ฉันลองคือ: //Annotations... export class MyComponent { constructor(myService: MyService) { //myService is injected properly and i already use methods/shared data on this. myService.myevent.on(... // 'on' …

112 javascript  angular 

ฉันพยายามนำทางไปยังหน้าอื่นโดยคลิกปุ่ม แต่ไม่สามารถใช้งานได้ สิ่งที่อาจเป็นปัญหา ตอนนี้ฉันกำลังเรียนรู้เชิงมุม 2 และตอนนี้มันค่อนข้างยากสำหรับฉัน //Routes/Path in a folder call AdminBoard export const AdminRoutes: Routes =[ { path: 'dashboard', component: AdminComponent, children: [ {path: '', redirectTo: 'Home'}, {path: 'Home', component: HomeComponent}, {path: 'Service', component: ServiceComponent}, {path: 'Service/Sign_in', component:CustomerComponent} ] } ]; //Button is also in a different folder. Click …

112 angular 

ฉันมีชุดส่วนประกอบเซลล์เดียวภายในไฟล์ ng-forลูป ฉันมีทุกอย่างเรียบร้อย แต่ดูเหมือนจะคิดไม่ออก ปัจจุบันฉันมี setTimeout(() => { scrollToBottom(); }); แต่จะไม่ได้ผลตลอดเวลาเนื่องจากรูปภาพดันวิวพอร์ตลงแบบอะซิงโครนัส วิธีใดที่เหมาะสมในการเลื่อนไปที่ด้านล่างของหน้าต่างแชทใน Angular 2

112 scroll  typescript  angular 

ฉันต้องการใช้ angular-cli กับแกน asp.net และฉันต้องการทราบว่าฉันจะเปลี่ยนเส้นทางของโฟลเดอร์dist ได้อย่างไร

112 angular  angular-cli 

ฉันต้องการเตือนผู้ใช้เกี่ยวกับการเปลี่ยนแปลงที่ไม่ได้บันทึกก่อนที่จะออกจากหน้าใดหน้าหนึ่งของแอป angular 2 ของฉัน ปกติฉันจะใช้window.onbeforeunloadแต่มันใช้ไม่ได้กับแอพพลิเคชั่นหน้าเดียว ฉันพบว่าในเชิงมุม 1 คุณสามารถเชื่อมโยง$locationChangeStartเหตุการณ์เพื่อโยนconfirmกล่องให้กับผู้ใช้ แต่ฉันไม่เห็นอะไรเลยที่แสดงให้เห็นว่าจะทำให้สิ่งนี้ทำงานได้อย่างไรกับเชิงมุม 2 หรือหากเหตุการณ์นั้นยังคงอยู่ . ฉันยังเห็นปลั๊กอินสำหรับ ag1 ที่มีฟังก์ชันสำหรับonbeforeunloadแต่อีกครั้งฉันไม่เห็นวิธีใดที่จะใช้มันสำหรับ ag2 ฉันหวังว่าจะมีคนอื่นพบวิธีแก้ปัญหานี้ วิธีใดวิธีหนึ่งจะใช้ได้ดีสำหรับวัตถุประสงค์ของฉัน

112 angular  angular2-routing