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

ฉันกำลังพยายามติดตามเอกสารบน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 …

232 angular  angular-material 

ปิด. คำถามนี้ไม่เป็นไปตามหลักเกณฑ์กองมากเกิน ไม่ยอมรับคำตอบในขณะนี้ ต้องการปรับปรุงคำถามนี้หรือไม่ อัปเดตคำถามเพื่อให้เป็นไปตามหัวข้อสำหรับ Stack Overflow ปิดให้บริการใน5 ปีที่ผ่านมา ปรับปรุงคำถามนี้ ฉันจะเริ่มโครงการใหม่โดยใช้ AngularJS (กองซ้อนเต็ม) โครงการของฉันจะต้องตอบสนองและฉันจะสร้างแม่แบบตั้งแต่เริ่มต้น ดังนั้นฉันต้องการคำแนะนำว่าจะเลือก bootstrap 3 (มีคำสั่งเชิงมุม) หรือการออกแบบวัสดุสำหรับเค้าโครงหรือไม่ ฉันจะซาบซึ้งอย่างมากถ้ามีคนสามารถระบุข้อดีข้อเสียของทั้งคู่

181 angularjs  twitter-bootstrap-3  material-design  angular-material 

ฉันใช้mat-tableเพื่อแสดงเนื้อหาของภาษาที่ผู้ใช้เลือก นอกจากนี้ยังสามารถเพิ่มภาษาใหม่โดยใช้แผงโต้ตอบ หลังจากที่พวกเขาเพิ่มภาษาและกลับมา ฉันต้องการให้แหล่งข้อมูลของฉันรีเฟรชเพื่อแสดงการเปลี่ยนแปลงที่พวกเขาทำ ฉันเริ่มต้นพื้นที่เก็บข้อมูลโดยรับข้อมูลผู้ใช้จากบริการและส่งต่อไปยังแหล่งข้อมูลในวิธีการรีเฟรช Language.component.ts import { Component, OnInit } from '@angular/core'; import { LanguageModel, LANGUAGE_DATA } from '../../../../models/language.model'; import { LanguageAddComponent } from './language-add/language-add.component'; import { AuthService } from '../../../../services/auth.service'; import { LanguageDataSource } from './language-data-source'; import { LevelbarComponent } from '../../../../directives/levelbar/levelbar.component'; import { DataSource } from '@angular/cdk/collections'; …

125 angular  angular-material  refresh 

ฉันกำลังดำเนินการกับหน้ารีเซ็ตรหัสผ่านของโปรเจ็กต์ Angular 4 เรากำลังใช้ Angular Material เพื่อสร้างกล่องโต้ตอบอย่างไรก็ตามเมื่อลูกค้าคลิกออกจากกล่องโต้ตอบมันจะปิดโดยอัตโนมัติ มีวิธีหลีกเลี่ยงการปิดกล่องโต้ตอบจนกว่าฝั่งรหัสของเราจะเรียกใช้ฟังก์ชัน "ปิด" หรือไม่? หรือว่าฉันควรสร้างunclosableกิริยา?

117 angular  dialog  modal-dialog  angular-material 

ฉันพยายามทำให้การ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 

ฉันใช้วัสดุที่ 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 

ฉันได้ติดตั้งวัสดุสำหรับเชิงมุมแล้ว ฉันนำเข้าในโมดูลแอป MatIconModule (with import { MatIconModule } from '@angular/material/icon';) ฉันได้เพิ่มไว้ภายใต้การนำเข้า ngmodule ของฉันด้วย: @NgModule({ imports: [ //... MatIconModule, //... ฉันนำเข้าสไตล์ชีททั้งหมดแล้ว และฉันยังนำเข้าในส่วนประกอบแอปของฉันซึ่งจริง ๆ แล้ว (พยายาม) ใช้ (โดยมีimport {MatIconModule} from '@angular/material/icon';บรรทัดอื่นอยู่ตอนต้น) แต่ไอคอนวัสดุยังไม่ปรากฏ ตัวอย่างเช่นในบรรทัดนี้: <button mat-icon-button (click)="snav.toggle()"><mat-icon>menu</mat-icon></button> ฉันคาดหวังสิ่งนี้: แต่ฉันได้รับสิ่งนี้: มีข้อเสนอแนะหรือไม่?

93 angular  angular-material  angular-material2 

ฉันพยายามตั้งเป็นค่าเริ่มต้นของเหตุการณ์แรกในตัวอย่างนี้: plunkr ได้รับข้อผิดพลาดต่อไปนี้: Unhandled Promise rejection: Template parse errors: TypeError: Cannot read property 'toUpperCase' of undefined ("dButtonToggleGroup"> <md-button-toggle [ERROR ->]*ngFor="let indicador of indicadores; #first = first" value="indicador.id" [checked]="first">"): ng:///AppModule/HomeComponent.html@35:78 Parser Error: Unexpected token #, expected identifier, keyword, or string at column 31 in [let indicador of indicadores; #first = first] …

92 angular  angular-material 

ฉันจะเปลี่ยนรหัสวัสดุเชิงมุมด้านล่างได้อย่างไรเพื่อให้ตารางข้อมูลจัดเรียงตามคอลัมน์ 'ชื่อ' โดยเรียงลำดับจากน้อยไปมากตามค่าเริ่มต้น ต้องแสดงลูกศร (ระบุทิศทางการจัดเรียงปัจจุบัน) นี่คือสิ่งที่ฉันต้องการบรรลุ: รหัสเดิม: <table matSort (matSortChange)="sortData($event)"> <tr> <th mat-sort-header="name">Dessert (100g)</th> <th mat-sort-header="calories">Calories</th> <th mat-sort-header="fat">Fat (g)</th> <th mat-sort-header="carbs">Carbs (g)</th> <th mat-sort-header="protein">Protein (g)</th> </tr> <tr *ngFor="let dessert of sortedData"> <td>{{dessert.name}}</td> <td>{{dessert.calories}}</td> <td>{{dessert.fat}}</td> <td>{{dessert.carbs}}</td> <td>{{dessert.protein}}</td> </tr> </table> ฉันกำลังลองสิ่งนี้ แต่ไม่ได้ผล (ไม่มีลูกศรแสดงขึ้นไม่ได้เรียงลำดับ) <table matSort (matSortChange)="sortData($event)" matSortActive="name" matSortStart="asc" matSortDisableClear> นี่คือลิงค์ไปยังPlunker

90 angular  angular-material 

ฉันใหม่ในการพัฒนาเชิงมุม 5 ฉันกำลังพยายามพัฒนาตารางข้อมูลด้วยวัสดุเชิงมุมโดยใช้ตัวอย่างที่ให้ไว้ที่นี่: " https://material.angular.io/components/table/examples " ฉันได้รับข้อผิดพลาดแจ้งว่า Can't bind to 'dataSource' since it isn't a known property of 'table'. กรุณาช่วย.

88 angular  datatable  angular-material 

ฉันมีคำถามเกี่ยวกับ Angular Material (ที่มี Angular 4+) พูดในเทมเพลตองค์ประกอบของฉันฉันเพิ่ม<mat-horizontal-stepper>องค์ประกอบและในแต่ละขั้นตอน<mat-step>ฉันมีปุ่มสเต็ปเปอร์เพื่อนำทางส่วนประกอบ ชอบจัง ... <mat-horizontal-stepper> <mat-step> Step 1 <button mat-button matStepperPrevious type="button">Back</button> <button mat-button matStepperNext type="button">Next</button> </mat-step> <mat-step> Step 2 <button mat-button matStepperPrevious type="button">Back</button> <button mat-button matStepperNext type="button">Next</button> </mat-step> <mat-step> Step 3 <button mat-button matStepperPrevious type="button">Back</button> <button mat-button matStepperNext type="button">Next</button> </mat-step> </mat-horizontal-stepper> ตอนนี้ฉันกำลังสงสัยว่าเป็นไปได้หรือไม่ที่จะลบปุ่มออกจากแต่ละขั้นตอนและวางไว้ที่อื่นใน<mat-horizontal-stepper>ตำแหน่งคงที่หรือแม้กระทั่งภายนอก<mat-horizontal-stepper>และฉันสามารถนำทางไปข้างหลังและข้างหน้าโดยใช้โค้ดภายในไฟล์ typescript ของคอมโพเนนต์ของฉัน …

88 angular  angular-material  angular-material2 

ด้วย Angular 8 ในขณะที่สร้างแอปเราพบข้อผิดพลาดดังต่อไปนี้: app/modules/admin-module/pages/editor/editor.component.ts:6:27 - error TS2306: File ...node_modules/@angular/material/index.d.ts' is not a module.

40 angular  angular-material 

ฉันกำลังเรียนรู้วัสดุเชิงมุมและฉันได้รับข้อผิดพลาดนี้เมื่อนำเข้า {MatButtonModule} จาก "@ angular / material / button" จากสิ่งที่ฉันอ่านในคำตอบอื่น ๆ ดูเหมือนว่าปัญหาความเข้ากันได้ของแพ็คเกจ แต่ฉันไม่สามารถแก้ไขได้ นี่คือข้อผิดพลาดแบบเต็ม ERROR in node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts(29,9): error TS1086: An accessor cannot be declared in an ambient context. node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts(30,9): error TS1086: An accessor cannot be declared in an ambient context. node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts(128,9): error TS1086: An accessor cannot be declared in an …

25 angular  angular-material