我正在尝试使用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模板吗?我最初尝试过,但也无法使它工作.
我正在忙于一个我正在使用angular-flex-layout的项目.据我所知,如果将fxLayoutWrap属性应用于容器,则flex容器应该换行到下一行.由于某种原因,我有一个非常小的x溢出.它曾经更大,然后我删除了我在两个fxLayout行容器上的一些fxLayoutGaps,这使它变得更好.当我将fxLayoutWrap属性应用于父(仪表板组件的第一行)行容器时,我不知道这可能是什么原因.知道我做错了什么吗?
滚动到右侧后页面的图片
滚动到右边之前的图片:
我的代码:
我的主页组件的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) 我无法获得一个堆栈视图来填充视图画布,以便我的窗口小部件自动调整大小以填满整个屏幕...我已经在可能的教程/ 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屏幕上显示任何内容,并且我收到一条消息,指出无法满足一个或多个约束.知道我做错了什么吗?
我正在尝试运行一个非常简单的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) 我正在尝试向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) 我正在尝试编写一个使用DOM来编写注册列表的类,以XML格式存档.注册列表包含三种类型的注册Registration,它们是标准的基本注册类GuestRegistration,StudentRegistration它们都来自Registration.
该GuestRegistration班级有一个独特的成员category,学生注册有独特的成员qualification.
当我遍历注册指针列表时,我只能访问基类Registration的成员函数.有没有什么办法可以访问子的数据成员使用getter函数getCategory和getQualification?每当类名与两者中的任何一个匹配时,我都尝试创建一个GuestRegistration和StudentRegistration指针,但是得到一个指针转换错误.
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) 我有一个带有用户名和密码 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=" 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) 我有一个抽象基类“Company”和两个派生自“Company”的子类“notForProfit”和“forProfit”。两个子类都有成员变量“name”和“dateFormed”。是否可以在“Company”中定义这 2 个成员变量并让 2 个子类继承“Name”和“DateFormed”以在其构造函数中使用?
我正忙于一个需要向本地网络上的服务器发出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?
我最近开始使用角度材料,我正在努力/不确定打开/关闭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) 我试图弄清楚如何使用 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) 我已经阅读了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) 我正在尝试将角度/材质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) angular ×7
html5 ×4
css ×3
nativescript ×3
c++ ×2
javascript ×2
qt ×2
angular-cli ×1
angularjs ×1
axios ×1
cors ×1
flexbox ×1
heroku ×1
ios ×1
nestjs ×1
node.js ×1
rxjs ×1
uistackview ×1
uistoryboard ×1