কৌণিক 6 উপাদান ম্যাট-নির্বাচন পরিবর্তন পদ্ধতি সরানো হয়েছে removed


129

কৌণিক পদার্থ ডিজাইন 6 এ, (পরিবর্তন) পদ্ধতিটি সরানো হয়েছিল। আমি যখন ব্যবহারকারী পরিবর্তন নির্বাচন করতে পারি উপাদানটিতে কোড কার্যকর করতে পরিবর্তন পদ্ধতিটি কীভাবে প্রতিস্থাপন করতে পারি তা ধন্যবাদ!

উত্তর:


346

এটিকে বদলে দেওয়া changeহয়েছে selectionChange

<mat-select (change)="doSomething($event)">

এখন

<mat-select (selectionChange)="doSomething($event)">

https://material.angular.io/components/select/api


26
আমি এটিকে খুব ঘৃণা করি। গতকাল আমি ভেবেছিলাম এটি কৌণিক 6 এ আপগ্রেড করার জন্য দুর্দান্ত দিন Once
লুইস লাভেরি

17
(changeEventChange)পরিবর্তন ইভেন্টটি কখন পরিবর্তন হয় তা সনাক্ত করার জন্য তাদের একটি ইভেন্ট প্রয়োজন ।
স্ট্যাক Underflow

3
(সিলেকশন চেঞ্জ) এখন (onSelectionChange) এ আপডেট করা হয়েছে।
দেবাদাত

@ দেবাদাত্তা - আপনি এটি কোথায় দেখলেন? আমি এখনও দেখতে selectionChange material.angular.io/components/select/api
VtoCorleone

2
উপরের সমস্ত মন্তব্যগুলি কেবলমাত্র যেখানে সম্ভব যেখানে নীচে আমার উত্তর অনুসারে প্রতিক্রিয়াশীল ফর্ম অ্যাপোচকে আঁকড়ে রাখার অর্থ কেন বোধ হয় তা কেবলমাত্র আরও তুলে ধরে। পাশের নোটে, আমি মন্তব্যগুলি খুব ন্যায্য বলে মনে করি না কারণ কৌণিক উপাদানগুলি ছেলেরা একটি আশ্চর্যজনক কাজ করে এবং আমরা এটি নিখরচায় পেয়েছি।
জোসেফ সিম্পসন

24

আপনি যদি প্রতিক্রিয়াশীল ফর্মগুলি ব্যবহার করে থাকেন তবে আপনি এর মতো নির্বাচনের নিয়ন্ত্রণের পরিবর্তনের জন্য শুনতে পারেন ..

this.form.get('mySelectControl').valueChanges.subscribe(value => { ... do stuff ... })

1
এটি লক্ষণীয় যে উপরের প্রতিক্রিয়াশীল ফর্ম পদ্ধতির ব্যবহার করে আপনি ইউআই এর সাথে কম বাঁধা এবং ইউআই কাঠামোটি বিকশিত হওয়ায় সমস্যা হওয়ার সম্ভাবনা কম
জোসেফ সিম্পসন

আমি এটি পছন্দ করেছি, আমি এটি দিয়ে চেষ্টা করব।
ইউজারএক্স

কেবল এখানে নোট করুন যে আপনার যদি .updateValueAndValidityনিয়ন্ত্রণের প্রয়োজন হয় তবে { emitEvent: false }এড়ানোর জন্য পাস করতে ভুলবেন না RangeError: Maximum call stack size exceeded। অন্যদিকে ইঙ্গিতটির জন্য ধন্যবাদ (+1), এটি আমাকে যা প্রয়োজন তার দিকে নিয়ে যায়।
ডিসিজি

আমি যদি এই পদ্ধতির অনুসরণ করি তবে আমাকে এনজিওডাস্ট্রয়ে সাবস্ক্রাইব করা উচিত?
ওহিদানো

মেমরি ফাঁস এবং অপ্রত্যাশিত আচরণ এড়াতে আপনার সর্বদা আপনার সাবস্ক্রিপশন পরিষ্কার করতে হবে।
জোসেফ সিম্পসন

7

এর জন্য:

1) মাদুর নির্বাচন (selectionChange)="myFunction()" কৌণিক হিসাবে কাজ করে:

sample.component.html

 <mat-select placeholder="Select your option" [(ngModel)]="option" name="action" 
      (selectionChange)="onChange()">
     <mat-option *ngFor="let option of actions" [value]="option">
       {{option}}
     </mat-option>
 </mat-select>

sample.component.ts

actions=['A','B','C'];
onChange() {
  //Do something
}

2) সাধারণ এইচটিএমএল নির্বাচন করুন (change)="myFunction()" কৌণিক হিসাবে কাজ করে:

sample.component.html

<select (change)="onChange()" [(ngModel)]="regObj.status">
    <option>A</option>
    <option>B</option>
    <option>C</option>
</select>

sample.component.ts

onChange() {
  //Do something
}

3

আমার জন্য (selectionChange)এবং প্রস্তাবিতগুলি (onSelectionChange)কাজ করে না এবং আমি ব্যবহার করি না ReactiveForms। আমি যা করে শেষ করেছি তা হল (valueChange)ইভেন্টটি ব্যবহার করা :

<mat-select (valueChange)="someFunction()">

এবং এটি আমার পক্ষে কাজ করেছিল


আমি একটি টেমপ্লেট ফর্ম ব্যবহার করছি, এবং নিম্নলিখিতগুলি ব্যবহার করে আমার সাথে কাজ করেছি: <mat-select placeholder="Select an option" [(ngModel)]="project.managerId" name="managerId" required (selectionChange)="fillComanager(project.managerId)"> <mat-option *ngFor="let manager of managers" [value]="manager.id"> {{ manager.name }} </mat-option> </mat-select>
পিসিড্রো

1

মাদুর-বিকল্প-গ্রুপ নিয়ে আমার আজ এই সমস্যাটি রয়েছে। যে সমস্যাটি আমাকে সমস্যার সমাধান করেছে তা হ'ল মাদুর-নির্বাচনের অন্যান্য সরবরাহিত ইভেন্টগুলিতে ব্যবহার করছে: মান পরিবর্তন

আমি এখানে বোঝার জন্য একটি ছোট কোড রেখেছি:

<mat-form-field >
  <mat-label>Filter By</mat-label>
  <mat-select  panelClass="" #choosedValue (valueChange)="doSomething1(choosedValue.value)"> <!-- (valueChange)="doSomething1(choosedValue.value)" instead of (change) or other event-->

    <mat-option >-- None --</mat-option>
      <mat-optgroup  *ngFor="let group of filterData" [label]="group.viewValue"
                    style = "background-color: #0c5460">
        <mat-option *ngFor="let option of group.options" [value]="option.value">
          {{option.viewValue}}
        </mat-option>
      </mat-optgroup>
  </mat-select>
</mat-form-field>

মাদুর সংস্করণ:

"@ কৌণিক / উপাদান": "^ 6.4.7",

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.