小编Ant*_*ppe的帖子

我正在使用Typescript在Angular 2中开发一个网站,我想知道是否有办法实现thread.sleep(ms)功能.

我的用例是在几秒钟之后提交表单后重定向用户,这在html或javascript中非常容易,但我不知道如何在Typescript中执行此操作.

非常感谢,

假设我有一个组件:

@Component({
    selector: 'MyContainer',
    template: `
    <div class="container">
        <!-- some html skipped -->
        <ng-content></ng-content>
        <span *ngIf="????">Display this if ng-content is empty!</span>
        <!-- some html skipped -->
    </div>`
})
export class MyContainer {
}

现在,如果<ng-content>此组件为空,我想显示一些默认内容.有没有直接访问DOM的简单方法？

我知道如何将服务注入组件(通过@Component),但是如何使用DI来传递组件之外的服务？

换句话说,我不想这样做:

export class MyFirstSvc {

}

export class MySecondSvc {
    constructor() {
        this.helpfulService = new MyFirstSvc();
    }
}

export class MyThirdSvc {
    constructor() {
        this.helpfulService = new MyFirstSvc();
    }
}

我想通过事件参数发生按钮单击事件时分配一些值:

$scope.update = function(context) {
    $scope.master = context;
};

我已经赋值user给了 $scope.master.

现在我看到angular.copy().所以我用angular.copy编写了代码.

$scope.update = function(context) {
    $scope.master = angular.copy(context)
};

两者都是一样的,那有什么区别？请告诉我angular.copy()和之间的区别equal(=).

Angular 2 beta默认使用html5路由.但是,当您转到组件并且路径更改(例如http:// localhost:5000/aboutus)并重新加载/刷新页面时,不会加载任何内容.

这篇文章也提出了这个问题.大多数答案都表示,如果我们要在角度2中进行HTML5路由,那么应该在服务器端处理这个路由问题.这里有更多讨论.

我不知道如何使用asp.net服务器环境来处理这个问题.

任何有角度的2开发人员也使用asp.net并遇到这个问题？

PS.我正在使用ASP.NET 5.我的Angular 2路由正在使用MVC路由.

在Angular2(Beta 6)中,我有一个主菜单组件.

<mainmenu></mainmenu>

我想为宽或窄绑定一个布尔值.所以我做到了这个:

<mainmenu [(menuvisible)]="true"></mainmenu>

但我想要的(我认为)是绑定到一个javascript类属性(因为我可能有其他东西需要绑定,但希望通过在组件中使用单个类来整洁).

我收到一个错误

EXCEPTION:模板解析错误:无效的属性名称'menumodel.visible'("

] [(menumodel.visible)] = "menumodel.visible">

如果我尝试使用单个变量而不是类,我会得到:

模板解析错误:解析器错误:意外的标记'='

然而,这(单向绑定？)似乎确实有效(但我可能想触发菜单从另一个组件扩展/缩小,所以觉得这应该是一个双向数据绑定属性):

<menu [vis]="true"></menu>

这是我的菜单组件:

@Component({
    selector: 'menu',
    templateUrl: './app/menu.html',
    providers: [HTTP_PROVIDERS, ApplicationService],
    directives: [ROUTER_DIRECTIVES, FORM_DIRECTIVES, NgClass, NgForm]
})
export class MenuComponent implements OnInit {

    mainmenu: MainMenuVM;

    constructor(private _applicationService: ApplicationService) {
        this.mainmenu = new MainMenuVM();
    }

    // ...ngOnInit, various functions

}

这是我的MainMenu View Model类

export class MainMenuVM {
    public visible: boolean;
    constructor(
    ) { this.visible = true; }
}

我正在尝试创建一个包含图标和文本的菜单,但可以缩小到只显示图标.我将向上发送此事件到父组件以更改菜单旁边的容器位置.触发内容容器以最大化将触发菜单缩小 - 我不是说这是最好的方法,但我想在深入之前解决这个特定的问题.

请注意:我不是在这里数据绑定到输入控件 - 只是数据绑定到组件,然后我可以修改UI.

这是来自Angular …

在我的Angular 2应用程序中,我有后端服务,如下所示.

getUserInterests() {
    return this.http.get('http://localhost:8080/test/selections').map((res: Response) => res.json());
}

在调用此服务后,我想在上一个服务成功之前调用另一个服务.

第二次服务

let params: URLSearchParams = new URLSearchParams();
    params.set('access_token', localStorage.getItem('access_token'));
    return this.http.get('http://localhost:8080/user/selections', { search: params }).map((res: Response) => res.json());

这两个服务分别返回两个JSON数组.然后我需要用这两个数组进行一些登录.

EDITED

service.ts

getUserInterests() {
    return this.http.get('http://localhost:8080/test/selections').map((res: Response) => res.json());
}

getSavedSelections() {
    let params: URLSearchParams = new URLSearchParams();
    params.set('access_token', localStorage.getItem('access_token'));
    return this.http.get('http://localhost:8080/interest/user/selections', { search: params }).map((res: Response) => res.json());
}

getSelectionList() {
    var obs = this.getUserInterests().flatMap(
        (interests) => {
            return Observable.forkJoin([
                Observable.of(interests),
                this.getSavedSelections()
            ]);
        }
    );
    return obs;
}

然后我在我的其他ts文件中使用以下来调用该服务. …

我有这个奇怪的错误,我使用PrimeNG在我的应用程序中显示DatePicker.当我尝试使用bootstrap时form-control,我得到了一个视觉错误.

这是我的模板:

<div class="form-group row">
    <div class="form-group col-md-2">
        <label for="valeur">Valeur</label>
        <input type="number" id="valeur" class="form-control" />
    </div>

    <div class="form-group col-md-5">
        <label for="dateDebut">Date de début</label>
        <p-calendar id="dateDebut" dateFormat="dd/mm/yy" styleClass="form-control" [showIcon]="true"></p-calendar>
    </div>

    <div class="form-group col-md-5">
        <label for="dateFin">Date de fin</label>
        <p-calendar id="dateFin" dateFormat="dd/mm/yy" styleClass="form-control" [showIcon]="true"></p-calendar>
    </div>
</div>

这是结果:

编辑

如果它有任何帮助,这里是生成的HTML:

<div class="form-group col-md-5" _ngcontent-scp-1="">
   <label for="dateDebut" _ngcontent-scp-1="">Date de début</label>
   <p-calendar ng-reflect-show-icon="true" ng-reflect-date-format="dd/mm/yy" ng-reflect-style-class="form-control" styleclass="form-control" id="dateDebut" dateformat="dd/mm/yy" _ngcontent-scp-1="">
      <!--template bindings={
         "ng-reflect-ng-if": "true"
         }-->
      <span ng-reflect-initial-classes="form-control" class="form-control ui-calendar" ng-reflect-raw-class="ui-calendar">
         <input id="dp1467976345328" ng-reflect-value="" class="hasDatepicker ui-inputtext …

在我们的Angular项目中,我们有一个包含表单字段和PrimeNG FileUpload的表单,我们尝试使用所选文件发送表单数据.

我们已经查看了Web 上的文档和大量示例,但它们都没有满足我们的要求(使用"保存"按钮发送表单和文件而不是自动上载或FileUpload按钮).

我们通过将每个模型属性附加到文件上载请求中的文件来尝试以下方法,但我认为必须通过在Save方法(在.ts文件中)中将文件附加到模型属性来实现更智能的方法.

HTML:

<p-fileUpload name="files" url="/MyController/Save" 
    (onBeforeSend)="onBeforeSendFile($event)" 
    (onUpload)="onUploadFile($event)" 
    (onError)="onErrorFile($event)" 
    (onBeforeUpload)="onBeforeUploadFoto($event)" 
    multiple="multiple" 
    chooseLabel="Select" 
    uploadLabel="Load" 
    cancelLabel="Cancel">
</p-fileUpload>

.TS:

//code omitted fo brevity

//at here we append model properties to the array in file upload request:
onBeforeUploadFoto(event: any) {
    event.formData.append('id', this.entityId);
    event.formData.append('name', this.entityName);
}

我想在我的应用程序中使用PrimeNG日历.当我运行代码时,我收到错误:

ReferenceError:未定义jQuery.

其他PrimeNG指令工作正常.如果我删除<p-calendar>错误消失.

我在我的应用中导入并包含了日历.顺便说一下,我正在使用最新版本的角度,路由器和表格.在此之前我遇到了这个问题,并通过更新表单提供程序来修复它

 <p-calendar [(ngModel)]="date"></p-calendar> 

Stacktrace摘录:

ReferenceError:在DebugAppView._View_AddShipmentComponent0.detectChangesInternal(AddShipmentComponent.template.js)的Calendar.ngAfterViewInit(eval at(http:// localhost:8080/js/app.js:930:2),:44:90)中未定义jQuery. :930:59)在DebugAppView.Appte.detectChanges(eval at(http:// localhost:8080/js/vendor.js:716:2),:243:14)在DebugAppView.detectChanges(eval at(http:/) /localhost:8080/js/vendor.js:716:2),:348:44)