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

อะไรคือความแตกต่างระหว่างสองสิ่งนี้และอะไรคือความแตกต่างของแต่ละกรณี? เอกสารจะไม่เป็นประโยชน์ว่า: forRoot สร้างโมดูลที่มีคำสั่งทั้งหมดเส้นทางที่กำหนดและบริการเราเตอร์เอง forChild สร้างโมดูลที่มีคำสั่งทั้งหมดและเส้นทางที่กำหนด แต่ไม่รวมบริการเราเตอร์ การเดาที่คลุมเครือของฉันคือโมดูลหนึ่งสำหรับโมดูล 'หลัก' และอีกโมดูลหนึ่งสำหรับโมดูลที่นำเข้า (เนื่องจากพวกเขาจะมีบริการจากโมดูลหลักอยู่แล้ว) แต่ฉันไม่สามารถนึกถึงกรณีการใช้งานได้จริงๆ

112 angular  router 

ติดตั้ง angular-cli ทั่วโลกโดยใช้ ( npm install -g angular-cli) แต่เมื่อฉันพยายามสร้างโครงการโดยใช้ng new my-projectมันเกิดข้อผิดพลาด: ng: ไม่พบคำสั่ง

112 angular  npm  angular-cli 

ตั้งแต่อัปเกรดเป็น Angular 2 รุ่นล่าสุดimgแท็กของฉัน: <img class='photo-img' [hidden]="!showPhoto1" src='{{theMediaItem.photoURL1}}'> กำลังแสดงข้อผิดพลาดของเบราว์เซอร์: ข้อยกเว้นเดิม: ข้อผิดพลาด: ค่าที่ไม่ปลอดภัยที่ใช้ในบริบท URL ทรัพยากร ค่าของ url คือ: http://veeu-images.s3.amazonaws.com/media/userphotos/116_1464645173408_cdv_photo_007.jpg แก้ไข: ฉันได้ลองทำตามคำแนะนำในวิธีแก้ปัญหาอื่น ๆ แล้วว่าคำถามนี้ควรจะซ้ำกัน แต่ฉันได้รับข้อผิดพลาดเดียวกัน ฉันได้เพิ่มรหัสต่อไปนี้ลงในคอนโทรลเลอร์: import {DomSanitizationService} from '@angular/platform-browser'; @Component({ templateUrl: 'build/pages/veeu/veeu.html' }) export class VeeUPage { static get parameters() { return [[NavController], [App], [MenuController], [DomSanitizationService]]; } constructor(nav, app, menu, sanitizer) …

112 angular 

ฉันใช้วัสดุที่ 2 md-raised-buttonการเพิ่ม ฉันต้องการใช้คำสั่งนี้ก็ต่อเมื่อเงื่อนไขบางอย่างกลายเป็นจริง ตัวอย่างเช่น: <button md-raised-button="true"></button> อีกตัวอย่างหนึ่ง: ฉันสร้างรูปแบบปฏิกิริยาไดนามิกพื้นฐานใน plunker ฉันใช้formArrayNameคำสั่งของรูปแบบปฏิกิริยาสำหรับอาร์เรย์ของการควบคุม ฉันต้องการใช้formArrayNameคำสั่งเฉพาะในกรณีที่เงื่อนไขเฉพาะกลายเป็นจริงมิฉะนั้นอย่าเพิ่มformArrayNameคำสั่ง นี่คือการเชื่อมโยง plunker

112 angular  angular-material  angular2-forms  angular2-directives  angular-material2 

ฉันอ้างถึงเอกสารนี้และเจอแนวคิดการรวบรวม หนึ่งสามารถใช้การรวบรวม JIT หรือ AOT อย่างไรก็ตามฉันพบว่ามันสั้นมากและจำเป็นต้องทราบรายละเอียดต่อไปนี้ ความแตกต่างระหว่างสองเทคนิคนี้ คำแนะนำเกี่ยวกับเวลาที่ควรใช้

112 angular  compilation 

ฉันกำลังเขียนบริการ Angular 2 ใน TypeScript ซึ่งจะใช้ประโยชน์จากlocalstorageไฟล์. ฉันต้องการที่จะฉีดอ้างอิงถึงเบราว์เซอร์windowวัตถุในการให้บริการของฉันตั้งแต่ฉันไม่ต้องการที่จะอ้างอิงตัวแปรใด ๆ ทั่วโลกเช่น $window1.x ฉันจะทำอย่างไร?

111 angular  typescript  dependency-injection 

เมื่อฉันพยายามสร้างโครงการใหม่ด้วยAngular CLIด้วย: ng n app ฉันได้รับข้อผิดพลาดนี้: fs.js: 640 return binding.open (pathModule._makeLong (path), stringToFlags (แฟล็ก), โหมด); ^ TypeError: เส้นทางต้องเป็นสตริงหรือบัฟเฟอร์ที่ TypeError (เนทีฟ) ฉันจะอัพเกรดหรือถอนการติดตั้งAngular CLI ได้อย่างไร?

111 angular  angular-cli 

ฉันมีบริการที่ส่งคืนค่าที่สังเกตได้ซึ่งส่งคำขอ http ไปยังเซิร์ฟเวอร์ของฉันและรับข้อมูล ฉันต้องการที่จะใช้ข้อมูลนี้ undefinedแต่ฉันมักจะจบลงด้วยการ มีปัญหาอะไร? บริการ : @Injectable() export class EventService { constructor(private http: Http) { } getEventList(): Observable<any>{ let headers = new Headers({ 'Content-Type': 'application/json' }); let options = new RequestOptions({ headers: headers }); return this.http.get("http://localhost:9999/events/get", options) .map((res)=> res.json()) .catch((err)=> err) } } ส่วนประกอบ: @Component({...}) export class EventComponent …

110 javascript  angular  asynchronous  typescript  observable 

ฉันต้องเรียกใช้ng serveทุกครั้งเมื่อมีการเปลี่ยนแปลงใด ๆ กับไฟล์ต้นฉบับฉันไม่มีข้อผิดพลาดในคอนโซล Angular CLI: 1.6.2 Node: 8.9.1 OS: linux ia32 Angular: 5.1.2 ... animations, common, compiler, compiler-cli, core, forms ... http, language-service, platform-browser ... platform-browser-dynamic, router @angular/cdk: 5.0.2-c3d7cd9 @angular/cli: 1.6.2 @angular/material: 5.0.3-e20d8f0 @angular-devkit/build-optimizer: 0.0.36 @angular-devkit/core: 0.0.22 @angular-devkit/schematics: 0.0.42 @ngtools/json-schema: 1.1.0 @ngtools/webpack: 1.9.2 @schematics/angular: 0.1.11 @schematics/schematics: 0.0.11 typescript: 2.4.2 …

110 angular 

ไปป์เป็นตัวกรองสำหรับการแปลงข้อมูล (รูปแบบ) ในเทมเพลต ฉันเจอpipe()ฟังก์ชันดังต่อไปนี้ pipe()ฟังก์ชันนี้หมายความว่าอย่างไรในกรณีนี้? return this.http.get<Hero>(url) .pipe( tap(_ => this.log(`fetched hero id=${id}`)), catchError(this.handleError<Hero>(`getHero id=${id}`)) );

110 angular  rxjs  angular-pipe  rxjs-pipe 

ฉันกำลังมองหาวิธีผูกฟังก์ชันเข้ากับทั้งหน้าของฉัน (เมื่อผู้ใช้กดปุ่มฉันต้องการให้เรียกใช้ฟังก์ชันใน component.ts ของฉัน) มันง่ายมากใน AngularJS ด้วย a ng-keypressแต่ใช้ไม่ได้กับ(keypress)="handleInput($event)". ฉันลองใช้กระดาษห่อ div ทั้งหน้า แต่ดูเหมือนจะไม่ได้ผล จะใช้งานได้เมื่อโฟกัสอยู่ที่มันเท่านั้น <div (keypress)="handleInput($event)" tabindex="1">

110 typescript  angular  keypress  key-bindings 

ใน AppComponent ฉันกำลังใช้ส่วนประกอบ nav ในโค้ด HTML UI ดูดี ไม่มีข้อผิดพลาดเมื่อทำการเสิร์ฟ ng และไม่มีข้อผิดพลาดในคอนโซลเมื่อฉันดูแอป แต่เมื่อฉันรัน Karma สำหรับโครงการของฉันมีข้อผิดพลาด: Failed: Template parse errors: 'app-nav' is not a known element: 1. If 'app-nav' is an Angular component, then verify that it is part of this module. 2. If 'app-nav' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' …

110 javascript  node.js  angular  typescript  karma-jasmine 

ฉันจะตรวจจับการคลิกภายนอกส่วนประกอบใน Angular ได้อย่างไร

110 html  events  angular  typescript 

ฉันกำลังทำงานกับแอพที่มีบทบาทมากมายที่ฉันต้องใช้ยามเพื่อบล็อกการนำทางไปยังส่วนต่างๆของแอพตามบทบาทเหล่านั้น ฉันรู้ว่าฉันสามารถสร้างคลาสการ์ดป้องกันสำหรับแต่ละบทบาทได้ แต่จะมีคลาสเดียวที่ฉันสามารถส่งผ่านพารามิเตอร์ไปได้ กล่าวอีกนัยหนึ่งฉันต้องการที่จะทำสิ่งที่คล้ายกันนี้: { path: 'super-user-stuff', component: SuperUserStuffComponent, canActivate: [RoleGuard.forRole('superUser')] } แต่เนื่องจากทั้งหมดที่คุณผ่านคือชื่อประเภทของยามของคุณจึงไม่สามารถคิดวิธีที่จะทำเช่นนั้นได้ ฉันควรจะบิตกระสุนและเขียนคลาสยามแต่ละตัวต่อบทบาทและทำลายภาพลวงตาของความสง่างามด้วยการมีประเภทพารามิเตอร์เดี่ยวแทนหรือไม่

110 angular  typescript  angular2-routing 

ฉันกำลังดิ้นรนเพื่อหาวิธีทำสิ่งนี้ ในองค์ประกอบหลักแม่แบบจะอธิบายถึง a tableและtheadองค์ประกอบ แต่มอบหมายการแสดงผลtbodyไปยังองค์ประกอบอื่นเช่นนี้: <table> <thead> <tr> <th>Name</th> <th>Time</th> </tr> </thead> <tbody *ngFor="let entry of getEntries()"> <my-result [entry]="entry"></my-result> </tbody> </table> ส่วนประกอบ myResult แต่ละรายการแสดงผลtrแท็กของตัวเองโดยทั่วไปจะเป็นดังนี้: <tr> <td>{{ entry.name }}</td> <td>{{ entry.time }}</td> </tr> เหตุผลที่ฉันไม่ใส่สิ่งนี้ลงในองค์ประกอบหลักโดยตรง (หลีกเลี่ยงความต้องการส่วนประกอบ myResult) คือจริงๆแล้วคอมโพเนนต์ myResult นั้นซับซ้อนกว่าที่แสดงไว้ที่นี่ดังนั้นฉันจึงต้องการใส่ลักษณะการทำงานในองค์ประกอบแยกต่างหากและไฟล์ DOM ที่ได้นั้นดูไม่ดี ฉันเชื่อว่านี่เป็นเพราะไม่ถูกต้องเนื่องจากtbodyสามารถมีได้เฉพาะtrองค์ประกอบ(ดู MDN)แต่ DOM ที่สร้างขึ้น (แบบง่าย) ของฉันคือ: <table> <thead> <tr> <th>Name</th> …

110 javascript  angular