Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

cant sort FormArray #104

Open
mm580486 opened this issue Jul 7, 2018 · 0 comments
Open

cant sort FormArray #104

mm580486 opened this issue Jul 7, 2018 · 0 comments

Comments

@mm580486
Copy link

mm580486 commented Jul 7, 2018

hi guys, are there any plans or documentation to be able to sort form array(almost)
i found this #51 issues but not working for me

social.component.html

<form [formGroup]="socialForm" novalidate (ngSubmit)="save(socialForm)">
    <div formArrayName="links" (drop)="dropped($event)" [model]="socialForm.controls" ngxDroppable id="link-list-group" class="link-list-group">
       <div class="link" 
       ngxDraggable
        [model]='link'
    *ngFor="let link of socialForm.controls.links.controls; let i=index">
        <div class="link-body" [formGroupName]="i">
        <div class="link-type">
                    <select name="" formControlName="link_type" id="">
                        <option disabled>نوع لینک را انتخاب کنید</option>
                        <option value="link">لینک</option>
                        <option value="pay">صفحه پرداخت</option>
                        <option value="button">دکمه تماس (ایمیل یا تلفن)</option>
                    </select>
            </div>
            <br>
            <div class="link-title">
                <input type="text" formControlName="title" name="" placeholder="عنوان" id="">
            </div>
<br>
            <div class="link-url">
                    <input type="text" formControlName="url" name="" placeholder="لینک" id="">
            </div>
        </div>   
            <div class="link-dots">
                    <i class="zmdi zmdi-view-toc"></i>
            </div>
            <div class="link-actions">
                    <i class="zmdi zmdi-delete" *ngIf="socialForm.controls.links.controls.length > 1" (click)="removeLink(i)"></i>
                    <i class="zmdi zmdi-chart"></i>
            </div>
       </div>


       
       <button type="submit" [disabled]="!socialForm.valid">Submit</button>


    </div>
</form>

social.component.html

public socialForm: FormGroup;
 identify: string;
 link_loader = false;
 public links: any;
 public lines: any;
 public link: any;
 constructor(
   public socialService: SocialService,
   public userService: UserService,
   private route: ActivatedRoute,
   private formBuilder: FormBuilder,
   private router: Router
 ) {
   this.socialForm = this.formBuilder.group({
     links: this.formBuilder.array([
       this.initLink(),
      ]),
     'domain': [''],
     'theme_id': [],
     'token': [this.userService.get_db_authentication_token()]
   });
  }
 dropped(event) {
   const linesCopy = [];
   this.lines = this.socialForm.get('links') as FormArray;
   for (const line of this.lines.controls) {
       linesCopy.push(line.value);
   }
   console.log(linesCopy);
   console.log(this.lines.value);
   this.lines.reset(linesCopy);
}

error
ERROR TypeError: sourceModel.indexOf is not a function

Getting this error in Angular 5

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants