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

คำถามเกี่ยวกับ Angular (เพื่อไม่ให้สับสนกับ AngularJS) ซึ่งเป็นกรอบเว็บจาก Google ใช้แท็กนี้สำหรับคำถามเชิงมุมซึ่งไม่เจาะจงสำหรับแต่ละเวอร์ชัน สำหรับเฟรมเวิร์กเว็บ AngularJS (1.x) ที่เก่ากว่าให้ใช้แท็ก angularjs

10
ข้อผิดพลาด Angular @ViewChild (): คาดว่าจะมีข้อโต้แย้ง 2 ข้อ แต่ได้รับ 1
เมื่อลองใช้ ViewChild ฉันได้รับข้อผิดพลาด ข้อผิดพลาดคือ "ไม่ได้ระบุอาร์กิวเมนต์สำหรับ 'opts'" ทั้ง @ViewChild กำลังให้ข้อผิดพลาด import { Component, OnInit, ElementRef, ViewChild, Output, EventEmitter } from '@angular/core'; import { Ingredient } from 'src/app/shared/ingredient.model'; @Component({ selector: 'app-shopping-edit', templateUrl: './shopping-edit.component.html', styleUrls: ['./shopping-edit.component.css'] }) export class ShoppingEditComponent implements OnInit { @ViewChild('nameInput') nameInputRef: ElementRef; @ViewChild('amountInput') amountInputRef: ElementRef; @Output() ingredientAdded = new …

1
ไม่มีผู้ให้บริการสำหรับ TemplateRef! (NgIf -> TemplateRef)
ฉันพยายามแสดงเครื่องหมายถูกหากคำตอบคือคำตอบที่ยอมรับได้: template: `<div ngIf="answer.accepted">✔</div>` แต่ฉันได้รับข้อผิดพลาดนี้: EXCEPTION: No provider for TemplateRef! (NgIf ->TemplateRef) ผมทำอะไรผิดหรือเปล่า?

7
การมอบหมาย: EventEmitter หรือสังเกตได้ในเชิงมุม
ฉันพยายามที่จะใช้งานบางอย่างเช่นรูปแบบการมอบหมายใน Angular เมื่อผู้ใช้คลิกที่ a nav-itemฉันต้องการเรียกใช้ฟังก์ชันที่ปล่อยเหตุการณ์ซึ่งควรได้รับการจัดการโดยองค์ประกอบอื่น ๆ ที่ฟังเหตุการณ์ นี่คือสถานการณ์: ฉันมีNavigationองค์ประกอบ: import {Component, Output, EventEmitter} from 'angular2/core'; @Component({ // other properties left out for brevity events : ['navchange'], template:` <div class="nav-item" (click)="selectedNavItem(1)"></div> ` }) export class Navigation { @Output() navchange: EventEmitter<number> = new EventEmitter(); selectedNavItem(item: number) { console.log('selected nav item ' + …

19
การเพิ่มความคิดเห็นแบบ Angular 2 @ViewChild จะไม่ส่งคืน
ฉันพยายามเรียนรู้ Angular 2 ฉันต้องการเข้าถึงองค์ประกอบลูกจากองค์ประกอบหลักโดยใช้@ViewChild Annotation นี่คือบางส่วนของรหัส: ในBodyContent.tsฉันมี: import {ViewChild, Component, Injectable} from 'angular2/core'; import {FilterTiles} from '../Components/FilterTiles/FilterTiles'; @Component({ selector: 'ico-body-content' , templateUrl: 'App/Pages/Filters/BodyContent/BodyContent.html' , directives: [FilterTiles] }) export class BodyContent { @ViewChild(FilterTiles) ft:FilterTiles; public onClickSidebar(clickedElement: string) { console.log(this.ft); var startingFilter = { title: 'cognomi', values: [ 'griffin' , 'simpson' ]} …

14
หยุดการแพร่กระจายเหตุการณ์ของเมาส์
วิธีที่ง่ายที่สุดในการหยุดการเผยแพร่กิจกรรมเมาส์ใน Angular 2 คืออะไร ฉันควรผ่าน$eventวัตถุพิเศษและเรียกstopPropagation()ตัวเองหรือมีวิธีอื่น ตัวอย่างเช่นใน Meteor ฉันสามารถย้อนกลับfalseจากตัวจัดการเหตุการณ์

15
วิธีรับพารามิเตอร์แบบสอบถามจาก url ใน Angular 2
ฉันใช้ angular2.0.0-beta.7 เมื่อองค์ประกอบที่มีการโหลดบนเส้นทางเช่นมันจะถูกเปลี่ยนเส้นทางไปยัง/path?query=value1 /pathทำไม GET params ถูกนำออก? ฉันจะรักษาพารามิเตอร์ไว้ได้อย่างไร? ฉันมีข้อผิดพลาดในเราเตอร์ ถ้าฉันมีเส้นทางหลักเช่น @RouteConfig([ { path: '/todos/...', name: 'TodoMain', component: TodoMainComponent } ]) และเส้นทางลูกของฉันเช่น @RouteConfig([ { path: '/', component: TodoListComponent, name: 'TodoList', useAsDefault:true }, { path: '/:id', component: TodoDetailComponent, name:'TodoDetail' } ]) จากนั้นฉันไม่สามารถรับพารามิเตอร์ใน TodoListComponent ฉันสามารถที่จะรับ params("/my/path;param1=value1;param2=value2") แต่ฉันต้องการความคลาสสิค query params("/my/path?param1=value1&param2=value2")

30
วิธีเพิ่ม bootstrap ให้กับโครงการ angular-cli
เราต้องการใช้ bootstrap 4 (4.0.0-alpha.2) ในแอพของเราที่สร้างขึ้นด้วย angular-cli 1.0.0-beta.5 (w / node v6.1.0) หลังจากรับ bootstrap และการขึ้นต่อกันด้วย npm แนวทางแรกของเราประกอบด้วยการเพิ่มในangular-cli-build.js: 'bootstrap/dist/**/*.min.+(js|css)', 'jquery/dist/jquery.min.+(js|map)', 'tether/dist/**/*.min.+(js|css)', และนำเข้าพวกเขาในของเรา index.html <script src="vendor/jquery/dist/jquery.min.js"></script> <script src="vendor/tether/dist/js/tether.min.js"></script> <link rel="stylesheet" type="text/css" href="vendor/bootstrap/dist/css/bootstrap.min.css"> <script src="vendor/bootstrap/dist/js/bootstrap.min.js"></script> สิ่งนี้ใช้ได้ดีกับng serveแต่ทันทีที่เราสร้างบิลด์ด้วยการ-prodขึ้นต่อกันทั้งหมดเหล่านี้หายไปจากdist/vendor(ประหลาดใจ!) เรามีจุดประสงค์ในการจัดการสถานการณ์ดังกล่าว (เช่นการโหลดสคริปต์ bootstrap) ในโครงการที่สร้างด้วย angular-cli อย่างไร เรามีความคิดต่อไปนี้ แต่เราไม่รู้จริงๆว่าจะไปทางไหน ... ใช้ CDN หรือไม่ แต่เราต้องการให้บริการไฟล์เหล่านี้เพื่อรับประกันว่าจะสามารถใช้งานได้ คัดลอกการอ้างอิงไปdist/vendorหลังจากที่เราng build -prod? แต่ดูเหมือนว่าสิ่งที่ควรจะให้ …

10
กล่องโต้ตอบเนื้อหาของ Angular2 มีปัญหา - คุณเพิ่มไปยัง @ NgModule.entryComponents หรือไม่
ฉันกำลังพยายามติดตามเอกสารบนhttps://material.angular.io/components/component/dialogแต่ฉันไม่เข้าใจว่าทำไมถึงมีปัญหาด้านล่าง ฉันเพิ่มด้านล่างในส่วนของฉัน: @Component({ selector: 'dialog-result-example-dialog', templateUrl: './dialog-result-example-dialog.html', }) export class DialogResultExampleDialog { constructor(public dialogRef: MdDialogRef<DialogResultExampleDialog>) {} } ในโมดูลของฉันฉันเพิ่ม import { HomeComponent,DialogResultExampleDialog } from './home/home.component'; @NgModule({ declarations: [ AppComponent, LoginComponent, DashboardComponent, HomeComponent, DialogResultExampleDialog ], // ... แต่ฉันได้รับข้อผิดพลาดนี้ .... EXCEPTION: Error in ./HomeComponent class HomeComponent - inline template:53:0 caused by: No component …

15
เหตุการณ์การปรับขนาดหน้าต่างเชิงมุม
ฉันต้องการทำงานบางอย่างตามเหตุการณ์การปรับขนาดหน้าต่าง (ขณะโหลดและแบบไดนามิก) ขณะนี้ฉันมี DOM ของฉันดังนี้: <div id="Harbour"> <div id="Port" (window:resize)="onResize($event)" > <router-outlet></router-outlet> </div> </div> เหตุการณ์เริ่มทำงานอย่างถูกต้อง export class AppComponent { onResize(event) { console.log(event); } } ฉันจะดึงความกว้างและความสูงจากวัตถุเหตุการณ์นี้ได้อย่างไร ขอบคุณ

8
อะไรคือความแตกต่างระหว่าง“ ng-bootstrap” และ“ ngx-bootstrap”?
ความแตกต่างระหว่าง "ng-bootstrap" และ "ngx-bootstrap" คืออะไร? พวกเขาเกี่ยวข้องกันหรือไม่? หรือพวกเขาเพียงแค่การใช้งานพร้อมกัน? มีใครบางคนทำงานกับพวกเขาทั้งสองและสามารถให้ / อธิบายข้อดีและข้อเสียของทั้งสองได้หรือไม่ ด้วย "ng-bootstrap" ฉันหมายถึงhttps://ng-bootstrap.github.io/#/homeและ ด้วย "NGX-บูต" ผมหมายถึงhttp://valor-software.com/ngx-bootstrap/ ทั้งเกี่ยวข้องกับ Angular 4 ( ไม่ใช่กับ AngularJS! ) และ Bootstrap 4 โปรดทราบว่านี่ไม่ใช่คำถามที่ซ้ำซ้อนของความแตกต่างระหว่าง ngx-bootstrap และ ng2 bootstrap? .

23
วิธีการใช้ห้องสมุด moment.js ในแอพ angular 2 typescript
ฉันพยายามใช้กับการเชื่อม typescript: npm install moment --save typings install moment --ambient -- save test.ts: import {moment} from 'moment/moment'; และไม่มี: npm install moment --save test.ts: var moment = require('moment/moment'); แต่เมื่อฉันเรียกโมเมนต์รูปแบบ () ฉันได้รับข้อผิดพลาด ควรจะเรียบง่ายหรือไม่ทุกคนสามารถให้ชุดคำสั่ง / ชุดการนำเข้าที่จะทำงานได้หรือไม่


2
ฉันจะเขียนคุณสมบัติข้อมูลโดยใช้ Angular ได้อย่างไร
เมื่อฉันพยายามที่จะใช้data attributeในของฉันtemplateเช่นนี้: <ol class="viewer-nav"> <li *ngFor="#section of sections" data-value="{{ section.value }}"> {{ section.text }} </li> </ol> Angular 2 ขัดข้องด้วย: ข้อยกเว้น: ข้อผิดพลาดในการแยกวิเคราะห์แม่แบบ: ไม่สามารถผูกกับ 'sectionvalue' เนื่องจากไม่ใช่คุณสมบัติดั้งเดิมที่รู้จัก (" ] data-sectionvalue = "{{section.value}}"> {{section.text}} เห็นได้ชัดว่าฉันขาดอะไรบางอย่างกับไวยากรณ์โปรดช่วยด้วย

6
ข้อผิดพลาด tslint / codelyzer / ng lint: คำสั่ง“ for (… in …)” ต้องถูกกรองด้วยคำสั่ง if”
ข้อความแสดงข้อผิดพลาดผ้าสำลี: src / app / detail / edit / edit.component.ts [111, 5]: สำหรับคำสั่ง (... in ... ) ต้องถูกกรองด้วยคำสั่ง if ข้อมูลโค้ด (เป็นรหัสที่ใช้งานได้นอกจากนี้ยังมีให้ที่ส่วนการตรวจสอบความถูกต้องของแบบฟอร์ม angular.io ): for (const field in this.formErrors) { // clear previous error message (if any) this.formErrors[field] = ''; const control = form.get(field); if (control && control.dirty && !control.valid) { …


โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.