angular - How to configure a mdl-dialog in the declarative way -


i'm trying use mdl-dialog component showed here: http://mseemann.io/angular2-mdl/dialogs-declarative

but compiler says:

can't bind 'mdl-dialog-config' since isn't known property of 'mdl-dialog'.

  1. if 'mdl-dialog' angular component , has 'mdl-dialog-config' input, verify part of module.
  2. if 'mdl-dialog' web component add "custom_elements_schema" '@ngmodule.schemas' of component suppress message.

my full component is:

  import { component, input, oninit, viewcontainerref } '@angular/core';   import { domsanitizer } '@angular/platform-browser';   import { router, activatedroute, params } '@angular/router';    import { orderitem } '../models/orderitem';   import { sizerunbox } '../models/sizerunbox';   import { customer } '../models/customer';    import { collectiondataservice } '../services/collectiondata.service';    import { mdldialogoutletservice, mdldialogcomponent, mdldialogreference } 'angular2-mdl';    export interface orderitemwithsizerunboxes extends orderitem {      sizerunboxes: sizerunbox[];   }    @component({     selector: 'ordercart',     templateurl: 'app/ordercart/ordercart.component.html',     styleurls: ['app/ordercart/ordercart.component.css']   })   export class ordercart implements oninit {      ordercart: orderitemwithsizerunboxes[];      ordercartsizerunboxes: sizerunbox[];      from: string = "";      raworderdate: date = new date();      orderdate: string = "";      customers: customer[] = [];       constructor(            private route: activatedroute,            private router: router,            private sanitizer: domsanitizer,            private collectiondataservice: collectiondataservice,            private dilalogouletservice: mdldialogoutletservice,            private viewcontainerref: viewcontainerref         ) {          this.dilalogouletservice.setdefaultviewcontainerref(this.viewcontainerref);      }       ngoninit() {         this.orderdate = this.raworderdate.toisostring().slice(0,10);          this.route.params.foreach((params: params) => {            this.from = params['from'];         });          this.ordercart = <orderitemwithsizerunboxes[]>this.collectiondataservice.getordercart();         this.ordercartsizerunboxes = this.collectiondataservice.getordercartsizerrunboxes();         this.ordercart.map(orderitem => {               orderitem.imagesrc = this.sanitizer.bypasssecuritytrustresourceurl("/template/images/"+orderitem.itemid+".jpg");               orderitem.sizerunboxes = this.ordercartsizerunboxes.filter(sritem => sritem.orderitemid === orderitem.idorderitems);            });          this.collectiondataservice.            getcustomers()            .then(customers => this.customers = customers);      }   }

and template put:

<button #sendorderbutton (click)="sendorderdialog.show()" mdl-button mdl-button-type="icon" mdl-ripple>         <mdl-icon>send</mdl-icon>      </button>      <mdl-dialog #sendorderdialog  [mdl-dialog-config]="{            clickoutsidetoclose: true,            styles:{'width': '300px'},            ismodal:true,            openfrom: sendorderbutton,            entertransitionduration: 400,            leavetransitionduration: 400}">      // ...      </mdl-dialog>

with template outlet in body element of app.

if remove configuration:

<button #sendorderbutton (click)="sendorderdialog.show()" mdl-button mdl-button-type="icon" mdl-ripple>         <mdl-icon>send</mdl-icon>      </button>      <mdl-dialog #sendorderdialog>

the dialog starts work.

following michael's example here, tried import these classes in component:

  import { mdldialogcomponent } '../../node_modules/angular2-mdl/components/dialog/index';   import { mdldialogreference } '../../node_modules/angular2-mdl/components/dialog/mdl-dialog.service';

but error persists. missing?

edit here app.module:

import { ngmodule, locale_id } '@angular/core';   import { browsermodule } '@angular/platform-browser';   import { formsmodule, reactiveformsmodule } '@angular/forms';   import { httpmodule } '@angular/http';    import { mdlmodule } 'angular2-mdl';   import { mdlpopovermodule } '@angular2-mdl-ext/popover';   import { mdlselectmodule } '@angular2-mdl-ext/select';    import './rxjs-extensions';    import { appcomponent } './app.component';   import { mainpagecomponent } './mainpage/mainpage.component';   import { viewercomponent } './viewer/viewer.component';   import { productdetails } './productdetails/productdetails.component';   import { newitem } './newitem/newitem.component';   import { ordercart } './ordercart/ordercart.component';   import { statistics } './statistics/statistics.component';    import { approutingmodule } './app.routes';    import { collectiondataservice } './services/collectiondata.service';   import { customersearchpipe } './pipes/customer-search.pipe';   import { ordersearchpipe } './pipes/order-search.pipe';    import { inmemorywebapimodule } 'angular-in-memory-web-api';   import { inmemorydataservice } './services/in-memory-data.service';    import { highlightdirective } './highlight.directive';   import { hammergesturesdirective } './hammergestures.directive';     @ngmodule({      imports: [         browsermodule,         formsmodule,         reactiveformsmodule,         approutingmodule,         mdlmodule,         mdlpopovermodule,         mdlselectmodule,         httpmodule,         inmemorywebapimodule.forroot(inmemorydataservice),      ],      declarations: [         appcomponent,         mainpagecomponent,         viewercomponent,         productdetails,         newitem,         ordercart,         statistics,         customersearchpipe,         ordersearchpipe,         highlightdirective,         hammergesturesdirective,      ],      providers: [         { provide: locale_id, usevalue: "it-it" },         collectiondataservice      ],      bootstrap: [ appcomponent ]   })   export class appmodule { }

question solved upgrading angular2-mdl module version 2.4.0.


Comments

Post a Comment

Popular posts from this blog

asynchronous - C# WinSCP .NET assembly: How to upload multiple files asynchronously -

i using winscp .net assembly uploading files. want upload multiple files asynchronous way. have created method works single upload. public class uploadingdata { private sessionoptions _sessionoptions; private session _session; //connection etc private void onconnected() { foreach (var fileinfo in localfileslist) { var task = task.factory.startnew(() => uploadfilesasync(fileinfo)); } } private async task uploadfilesasync(string file) { string remotefilepath = _session.translatelocalpathtoremote(file, @"/", "/test_data_upload"); var uploading = _session.putfiles(file, remotefilepath, false); //when done await task.run(() => thread.sleep(1000)); } } please suggest me correct way. thanks you can use backgroundworker class this: string[] images = new string[50]; foreach (var path in images) { backgroundworker
Read more

aws api gateway - SerializationException in posting new Records via Dynamodb Proxy Service in API -

i getting "__type": "com.amazon.coral.service#serializationexception" as reply in postman & in test console in api gateway trying post record directly dynamodb using api proxy services.. referring aws article - https://aws.amazon.com/blogs/compute/using-amazon-api-gateway-as-a-proxy-for-dynamodb/ here's mapping { "tablename": "tablenamegoeshere", "item": { "id" : "$context.requestid" "eventname" : "$input.path('$.eventname')", "timestamp" : $input.path('$.timestamp'), "answers": "$util.parsejson($input.path('$.answers'))" } } update: did asked ... , worked if try add array of json objects gives me above same error - here's trying now. please - couldnt find on google well #set($inputroot = $input.path('$')) { "tablename": "answer", "item": {
Read more

asp.net - Problems sending emails from forum -

i have been redesigning site has message board, has been written guy looked after site. it has few problems , written in .asp , uses .mdb files database. you can see whole thing here . feel free post if helps, test thing have set using original files , new database. the basic problem when posts message, supposed email sent them, have posted it. when replies, originator supposed message, replier has been posted. i’d have thought @ point in process there should script/file in postmessage.asp? the postmessage.asp page below. <% option explicit %> <!-- #include virtual="common/adovbs.inc" --> <html> <head> <meta http-equiv="content-type" content="text/html; charset=windows-1252"> <meta name="generator" content="microsoft frontpage 4.0"> <meta name="progid" content="frontpage.editor.document"> <title>new page 2</title> <base target="_self"
Read more