小编use*_*257的帖子

如何在角度Web应用程序上实现angular-tour

我正在尝试使用ng-tour插件添加一个Web应用程序之旅:http://daftmonk.github.io/angular-tour/ 插件主页上的示例在单个网页上完成,使其变得困难让我弄清楚如何在角度Web应用程序上实现这一点.我在index.html中添加了以下内容:

我的代码:

将tour-step id添加到视图中:

<div ui-view="portal" ng-show="$state.includes('portal')" id="e0"></div>
Run Code Online (Sandbox Code Playgroud)

在我的index.html文件的底部:

<tour step="currentStep">
    <virtual-step tourtip="test " tourtip-element="#e0" tourtip-next-label="next" tourtip-placement="right" tourtip-step="0" ></virtual-step>

    </tour>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

当应用程序路由到门户视图时没有任何反应...我应该将ng-tour标记添加到各个视图HTML模板吗?我最初尝试过,但也无法使它工作.

javascript html5 angularjs

11
推荐指数
1
解决办法
1084
查看次数

无法摆脱x溢出(滚动条被隐藏,但我仍然可以滚动到右边)

我正在忙于一个我正在使用angular-flex-layout的项目.据我所知,如果将fxLayoutWrap属性应用于容器,则flex容器应该换行到下一行.由于某种原因,我有一个非常小的x溢出.它曾经更大,然后我删除了我在两个fxLayout行容器上的一些fxLayoutGaps,这使它变得更好.当我将fxLayoutWrap属性应用于父(仪表板组件的第一行)行容器时,我不知道这可能是什么原因.知道我做错了什么吗?

滚动到右侧后页面的图片

https://imgur.com/a/Ga4UR

滚动到右边之前的图片:

https://imgur.com/CWyWO4T

我的代码:

我的主页组件的HTML:

<mat-sidenav-container position="start" class="custom-sidenav-container">
    <mat-sidenav #sidenav mode="side" opened="true">
        Navigation
        <ul class="sn-list">
            <li>                    
                <mat-icon class="sn-item">
                    <i class="material-icons">dashboard</i>
                </mat-icon>
                <a class="sn-item" href="#">Dashboard</a>       
            </li>
            <li>

                <mat-icon class="sn-item">
                    <i class="material-icons">archive</i>
                </mat-icon>             
                <span class="sn-item" [matMenuTriggerFor]="stockSystemMenu">Stok System</span>

                <mat-menu [overlapTrigger]="false" #stockSystemMenu="matMenu">
                    <button mat-menu-item>
                        <mat-icon class="sn-item">
                            <i class="material-icons">chevron_right</i>
                        </mat-icon>
                        <span class="sn-item">Service 1</span>
                    </button>
                    <button mat-menu-item>
                        <mat-icon class="sn-item">
                            <i class="material-icons">chevron_right</i>
                        </mat-icon>
                        <span class="sn-item">Service 2</span>
                    </button>
                    <button mat-menu-item>
                        <mat-icon class="sn-item">
                            <i class="material-icons">chevron_right</i>
                        </mat-icon>
                        <span class="sn-item">Service 3</span>
                    </button>
                </mat-menu>
            </li>           
            <li>
                <mat-icon class="sn-item">
                    <i class="material-icons">shopping_cart</i> …
Run Code Online (Sandbox Code Playgroud)

css html5 flexbox angular-flex-layout angular

9
推荐指数
1
解决办法
464
查看次数

无法获得堆栈视图以填充其超级视图

我无法获得一个堆栈视图来填充视图画布,以便我的窗口小部件自动调整大小以填满整个屏幕...我已经在可能的教程/ youtube视频上看到了这个,但由于一些奇怪的原因,它没有'似乎对我有用我是怎么做到的:我有一个视图控制器场景,我试图显示三个水平放置的按钮,下方有三个标签.我将按钮和标签从对象库拖到视图画布上,然后将每个按钮和它的标签添加到垂直堆栈视图中.然后我将三个垂直堆栈视图添加到水平堆栈视图,并设置水平堆栈视图的分布以均匀填充.然后,我从水平堆栈视图中进行控制拖动,以在故事板中的视图控制器场景中进行查看,并设置以下约束.(我将故事板自动设置的所有常量归零,然后有以下4个约束)

trailingMargin = Stack View.trailing
Stack View.leading = leadingMargin
Stack View.top = Top Layout Guide.bottom
Bottom Layout Guide.top = Stack View.bottom
Run Code Online (Sandbox Code Playgroud)

当我运行应用程序时,我没有看到模拟器的iPhone屏幕上显示任何内容,并且我收到一条消息,指出无法满足一个或多个约束.知道我做错了什么吗?

ios uistoryboard uistackview

8
推荐指数
1
解决办法
1956
查看次数

Nativescript/angular2:没有applicationRef的提供者!部署后出错

我正在尝试运行一个非常简单的nativescript/angular2应用程序,它似乎构建正常但在应用程序部署到android(genymotion)模拟器后,我收到以下错误消息.所以似乎角度没有自举?不确定为什么这是......任何想法我做错了什么?

错误信息:

"@angular/core": "2.1.2",
"@angular/forms": "2.1.2",
    "@angular/http": "2.1.2",
    "@angular/platform-browseBUILD SUCCESSFUL

Total time: 1 mins 39.836 secs
Project successfully built
Successfully deployed on device with identifier '192.168.8.101:5555'.
JS: ns-renderer: ERROR BOOTSTRAPPING ANGULAR
JS: ns-renderer: No provider for ApplicationRef!
JS:
JS: Error: No provider for ApplicationRef!
JS:     at NoProviderError.Error (native)
JS:     at NoProviderError.BaseError [as constructor] (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/@angular/core/bundles/core.umd.js:1104:38)
JS:     at NoProviderError.AbstractProviderError [as constructor] (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/@angular/core/bundles/core.umd.js:1235:20)
JS:     at new NoProviderError (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/@angular/core/bundles/core.umd.js:1266:20)
JS:     at ReflectiveInjector_._throwOrNull (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/@angular/core/bundles/core.umd.js:2906:23)
JS:     at ReflectiveInjector_._getByKeyDefault (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/@angular/core/bundles/core.umd.js:2934:29)
JS:     at ReflectiveInjector_._getByKey (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/@angular/core/bundles/core.umd.js:2897:29)
JS:     at ReflectiveInjector_.get …
Run Code Online (Sandbox Code Playgroud)

nativescript angular

4
推荐指数
1
解决办法
6736
查看次数

cors-anywhere.herokuapp.com无法正常工作(503).我还能尝试什么?

我正在尝试向Wikipedia API发送get请求.我发送请求形式一个角度前端所以我正在尝试使用Heroku CORS Anywhere端点来避免CORS问题.出于某种原因,我仍然得到503响应,表示请求的资源上没有access-control-allow-origin报头.知道为什么会发生这种情况/我还能尝试什么?

我的代码:

import { Injectable } from '@angular/core';
import { Http, Response, } from '@angular/http';
import { Observable } from 'rxjs/Rx';



@Injectable()
export class RestService {
    API_URL: string = 'https://cors-anywhere.herokuapp.com/https://en.wikipedia.org/wiki/';

  constructor(private http: Http) { }

  public getRandomArticle() : Observable<any> {
        return this.http.get(`${this.API_URL}Special:Random`)
        .map((res: Response) => res.json())
        .catch((err: any) => Observable.throw(err || 'server error'));
  }

}
Run Code Online (Sandbox Code Playgroud)

javascript heroku cors angular cors-anywhere

4
推荐指数
1
解决办法
7992
查看次数

通过基类指针访问子类的成员函数

我正在尝试编写一个使用DOM来编写注册列表的类,以XML格式存档.注册列表包含三种类型的注册Registration,它们是标准的基本注册类GuestRegistration,StudentRegistration它们都来自Registration.

GuestRegistration班级有一个独特的成员category,学生注册有独特的成员qualification.

当我遍历注册指针列表时,我只能访问基类Registration的成员函数.有没有什么办法可以访问子的数据成员使用getter函数getCategorygetQualification?每当类名与两者中的任何一个匹配时,我都尝试创建一个GuestRegistrationStudentRegistration指针,但是得到一个指针转换错误.

void RegistrationListWriter::write(RegistrationList r) {
    QList<Registration*> regList = r.getRegistrationList();

    for (int i = 0; i < regList.size(); ++i) {
        QString cn = regList.at(i)->metaObject()->className();
        Person tempPerson = regList.at(i)->getAttendee();

        appendRegistrationAndType(cn);
        appendAttendee(tempPerson);
        //this is where my issue starts
        if (cn == "GuestRegistration") {
            GuestRegistration guestReg = regList.at(i);
            appendAttendeeCatagory(guestReg.getCatagory());
        }

        if (cn == "StudentRegistration") {
            StudentRegistration* stuReg = …
Run Code Online (Sandbox Code Playgroud)

c++ qt

3
推荐指数
1
解决办法
121
查看次数

Angular2/Nativescript:在软键盘上按下返回键时提交表单

我有一个带有用户名和密码 TextFields 的 Angular2/Nativescript 登录组件...当编辑密码 textField 时,我将 returnKeyType 设置为“done”,并期望在软键盘上按下 Done 时调用 login() 函数。在按下完成键的那一刻,键盘被解除,但登录功能没有被调用,所以我仍然需要在键盘被解除后点击登录按钮才能提交表单。当在 Nativescript 中的特定 TextField 上按下返回键时,有什么方法可以提交表单?如果是这样,我该如何实施它?我尝试了 returnPress 事件,但没有任何反应......

我的代码:

<ActionBar title="Login"></ActionBar>
<StackLayout class="page">
    <GridLayout columns="*, auto" rows="auto">
        <ActivityIndicator class="m-l-10 m-t-10 activity-indicator" [busy]="busy" [visibility]="busy ? 'visible' : 'collapse'" horizontalAlignment="left"></ActivityIndicator>
        <Button row="0" col="1" id="setIPBtn" class=" m-t-20 pull-right font-awesome" text="&#xf0ad; Settings" (tap)="setIP()"></Button>
    </GridLayout>

    <Label class="m-x-auto m-t-20 title h1 text-primary p-x-10" text="Log In" backgroundColor="blue"></Label>
    <StackLayout class="form">
        <StackLayout class="input-field">
            <Label class="body label text-left" text="Enter Username"></Label>
            <TextField class="input input-border" hint="Username" [(ngModel)]="username" autocorrect="false" autocapitalizationType="none" returnKeyType="next"></TextField>
        </StackLayout> …
Run Code Online (Sandbox Code Playgroud)

nativescript angular2-nativescript angular

3
推荐指数
1
解决办法
1013
查看次数

抽象基类成员变量

我有一个抽象基类“Company”和两个派生自“Company”的子类“notForProfit”和“forProfit”。两个子类都有成员变量“name”和“dateFormed”。是否可以在“Company”中定义这 2 个成员变量并让 2 个子类继承“Name”和“DateFormed”以在其构造函数中使用?

c++ qt

2
推荐指数
1
解决办法
8481
查看次数

Angular-cli:设置代理以处理进入另一个域的复杂请求的问题

我正忙于一个需要向本地网络上的服务器发出http请求的Web应用程序.我正在使用Angular-cli来构建/运行我的项目.在制作任何复杂的请求时,我遇到了CORS问题,并尝试使用angular-cli代理来处理那些复杂的请求......我的设置完全与在angular-cli github页面上完成的一样,但似乎没有上班.知道我做错了什么吗?

我的代码:

proxy.conf.json:

{
"/api":{
"target":"http://10.60.160.34/BRMServices/WebEnquiry/",
"secure":false
}
}
Run Code Online (Sandbox Code Playgroud)

来自package.json:

"start": "ng serve --proxy-config proxy.conf.json",
Run Code Online (Sandbox Code Playgroud)

具有复杂请求的函数应该转到代理:

postStockTake(stockTakeModel: StockTakeModel) : Observable<Response> {    
  return this.http.post("/api" + "/StockTake/AddToStockTake", JSON.stringify(stockTakeModel), {headers: this.headers})
        .map((res: Response) => res.json())
        .catch((error: any) => Observable.throw(error.json().error || 'server error'));
  }
Run Code Online (Sandbox Code Playgroud)

然后我用npm start而不是ng serve运行应用程序...当它开始构建时,我在命令提示符控制台中看到以下内容:

> barcode-checker@0.0.0 start C:\Users\User1\Documents\trade-link\barcode-checker
> ng serve --proxy-config proxy.conf.json
Run Code Online (Sandbox Code Playgroud)

在我的chrome dev工具控制台中,我看到:

zone.js:1725
POST
http://localhost:4200/api/StockTake/AddToStockTake
405 (Method Not Allowed)
Run Code Online (Sandbox Code Playgroud)

所以即使我在proxy.conf文件的目标值中添加了本地服务器的IP地址,它显然仍然试图发布到localhost?

angular-cli angular

2
推荐指数
1
解决办法
2162
查看次数

如何打开/关闭角度材质菜单

我最近开始使用角度材料,我正在努力/不确定打开/关闭mat菜单......我在角度材料文档网站的示例中看到,他们为菜单分配了一个id,然后将指令应用于用于切换菜单的按钮.例如[matMenuTriggerFor]="menu"

我怎样才能编写一个指令呢?我不确定如何将对特定菜单的引用传递给指令,然后该指令toggle()在具有该ID的DOM元素上调用该方法?

以下代码生成错误:

无法绑定到'matMenuTriggerFor',因为它不是'button'的已知属性.

"exportAs"设置为"matMenu"没有指令.
我的代码:

<li>
    <button mat-icon-button [matMenuTriggerFor]="stockSystemMenu">
        <mat-icon class="sn-item">
            <i class="material-icons">archive</i>
        </mat-icon>
    </button>
    <span class="sn-item" (click)="toggleMenu(stockSystemMenu)">Stok System</span>

    <mat-menu #stockSystemMenu="matMenu">
        <button mat-menu-item>
            <mat-icon>
                <i class="material-icons">chevron_right</i>
            </mat-icon>
        <span>Service 1</span>
        </button>
    </mat-menu>
</li>
Run Code Online (Sandbox Code Playgroud)

html5 angular-material angular

2
推荐指数
1
解决办法
5390
查看次数

如何使用 Nestjs HTTP 模块正确处理使用 Axios 发出 HTTP 请求时返回的可观察值

我试图弄清楚如何使用 Axios 和 Nestjs 框架发出 http 请求。在 Nest 文档中,它提供了该过程的高级概述,但没有详细介绍如何处理使用 axios 发出请求时返回的 Observable。

我正在使用相互 SSL 身份验证向 API 发出请求。我遇到了证书问题,请求失败,但没有引发异常,控制器返回 200 ok,没有数据。当我注释掉所有 rxjs 代码并执行 axios.get(...).toPromise() 时,我发现了这一点。当我这样做时,我突然有了完整的堆栈跟踪并引发了异常。

知道我在这里做错了什么吗?我应该将 catchError 块放在 map 块之前吗?

我的代码:

getRegistrationStatus(msisdn: string): Observable<AxiosResponse> {        
  return this.httpService.get(`${this.API_BASE_URL}/vb/registrationStatus?MSISDN=${msisdn}`)
    .pipe(            
      map(res => res.data),
      catchError(e => {
        throw new HttpException(e.statusText, e.status);
      })            
    );
}
Run Code Online (Sandbox Code Playgroud)

我的 HTTP 模块/axios 配置:

HttpModule.register({
  timeout: 20000,
  validateStatus: () => true,
  httpsAgent: new Agent({
    ca: readFileSync(process.env.va_ca),
    keepAlive: false,        
    cert: readFileSync(process.env.va_cert),
    key: readFileSync(process.env.va_key),
    passphrase: process.env.va_passphrase
  })
})
Run Code Online (Sandbox Code Playgroud)

node.js rxjs axios nestjs

2
推荐指数
1
解决办法
3908
查看次数

Angular2/Nativescript:如何突出显示ListView的选定项?

我已经阅读了Nativescript ListView文档并搜索了Google,无法找到任何方法来突出显示当前所选的Listview项目......这甚至可能吗?如果是这样我该怎么办呢?

我的代码:

<ListView [items]="activeStockTakes" class="list-group" (itemTap)="selectActiveStockTake($event)">
                    <template let-activeStockTake="item">
                        <StackLayout>
                            <Label class="list-group-item" [text]="activeStockTake.UserCode + ' - ' + activeStockTake.Comment"></Label>
                        </StackLayout>
                    </template>
                </ListView>
Run Code Online (Sandbox Code Playgroud)

css nativescript angular2-nativescript

1
推荐指数
1
解决办法
1532
查看次数

无法将角形/材质侧面的高度设置为100%

我正在尝试将角度/材质sidenav的高度设置为100%。由于某些原因,将其设置为22px使得它无法使用,因为sidenav中的任何项目都填满了整个高度...我设法通过使用mat-sidenav-container全屏属性来使其工作,但是当我执行所有其他内容时(应该在sidenav旁边)不会显示...阅读sidenav文档后发现:

“对于全屏Sidenav,推荐的方法是设置DOM,以便DOM自然可以占用全部空间:”

然后他们有一个示例,我正在尝试复制。当我在mat-sidenav-container的css样式(铬)中查看我的sn-content div时,我看到高度由于某些原因而变灰了吗?我已经从chrome dev tools inspect元素复制了选择器路径,并将高度设置为100%,但仍然没有运气。我也尝试使用!important,但这也没有任何改变。任何想法我在做什么错/这里可能会发生什么?

我的导航组件的html代码:

<mat-sidenav-container position="start">
    <mat-sidenav #sidenav mode="push">
        Navigation component width is ok
        <ul>
            <li>item</li>
            <li>item</li>
            <li>item</li>
            <li>item</li>
            <li>item</li>
            <li>item</li>
            <li>item</li>
        </ul>
    </mat-sidenav>
    <div class="sn-content">
    <button type="button" (click)="sidenav.toggle()">toggle</button>
    </div>
</mat-sidenav-container>
Run Code Online (Sandbox Code Playgroud)

我的导航组件的CSS:

body > app-root > app-home > navigation > mat-sidenav-container > mat-sidenav-content {
    margin: 0;
    height: 100% !important;
    width: 100%;
}
Run Code Online (Sandbox Code Playgroud)

然后,我在以下html代码中使用此导航组件:

<navigation></navigation>

        <div fxLayout="column" fxLayoutAlign="end end">
            <div fxFlex="20%">
            <h4>testing angular flex layout turning out to be quite unusual</h4>                
            </div>

        </div>
Run Code Online (Sandbox Code Playgroud)

css html5 angular-material angular

1
推荐指数
2
解决办法
5430
查看次数