我在angularJS中编写了一个封装所有后端通信的模块.为了获得更大的灵活性,我将api前缀作为模块的常量值(可能是值,因为我在配置阶段没有使用它).所以像
angular.module('myapp.data').constant('apiPrefix', '/api/data');
Run Code Online (Sandbox Code Playgroud)
现在我想从两个不同的应用程序中使用这个模块.一个使用/ api1/data和另一个/ api2/data,我想在应用程序的配置阶段更改它.我知道如何与提供商这样做,但让一个提供者来保持价值对我来说似乎是一种矫枉过正.我可以从应用程序配置阶段修改已使用的模块常量或值吗?
就像是:
angular.module("data", [])
.value('apiPrefix', '/api/data')
.factory('display', function(apiPrefix){
return {
pref: function(){
console.log(apiPrefix);
return apiPrefix;
}
}
});
angular.module("myApp",['data'])
.config(['apiPrefix', function(prefix){
prefix = 'https:/api/data';
}])
.controller("Example", function($scope, display) {
$scope.prefix = display.pref;
});
Run Code Online (Sandbox Code Playgroud) 我正在将我的应用程序从ngRoute转换为uiRouter.我已阅读并观看了很多教程,但我仍然缺乏决定最佳实践的经验.
首先,我所做的一项重大改变是将状态声明分解为每个模块/控制器.这对我来说感觉更自然,更清洁,但是当想要将全局规则应用于许多州时会引入一些复杂性.例如,我的一半路线需要验证,而另一半则不需要.使用ngRoute,我有一个数据属性,表示每个路由所需的auth级别.使用uiRouter,我知道有这样做的方式,并且有状态继承方式.所以路由可以是public.myRoute,其中public是在应用程序级别声明的抽象路由.如果某人没有定义公共状态,则模块无法独立工作会产生问题.相反,如果我在数据对象中添加元数据属性,如"auth_level:user",如果没有人处理它,这将不会影响模块.但这感觉更"神奇",更难以维护.
导航栏出现同样的问题.我的一半观点有一个导航栏而另一半没有.到目前为止,我使用了一个isNavbarVisible布尔属性但我明白这应该是状态的一部分?也许在layout.html模板中第二个ui-view而不是使用ng-include和ng-if,因为我到目前为止呢?
最后,我想知道要求解决每条路线的承诺的最佳做法.例如,无论应用程序入口点在何处,都应在加载视图之前首先解析用户权限.在ngRoute中,我循环遍历其定义中的所有路由并添加该承诺.
从ngRoute迁移到uiRouter时,是否有一个很好的最佳实践指南,因为除了通常的建议,如"替换ng-include",名称为ui-view或者应该首选状态继承,我还没有找到任何具体的实现演示那.
我已经编写了一个角度提供程序,需要在$ get函数中注入$ inject服务,但我不知道如何在打字稿中写这个并使其缩小安全性.像static $ injector = ['']; 适用于服务和控制器的符号.
打字稿:
export class ApiProvider implements IApiProvider {
private baseRoute: string = '';
private endpoints: { [name: string]: IApiEndPointConfig };
static $inject = ['$injector']; //THIS DOES NOT WORK FOR PROVIDERS
constructor() {
this.baseRoute = '';
this.endpoints = {};
}
// MORE CODE
$get = ($injector: ng.auto.IInjectorService): { [name: string]: ApiEndpoint } => {
var api: { [name: string]: ApiEndpoint } = {};
var self:ApiProvider = this;
angular.forEach(this.endpoints, (endpointConfig, name) => {
api[name] = …Run Code Online (Sandbox Code Playgroud) 我正在尝试编写一个Angular2属性指令来修改某些元素的行为.更具体地说,我想将属性应用于具有单击处理程序的某些元素,并防止在特定条件下执行绑定函数.
所以现在我有一个元素,例如:
<button (click)="onClick(param1, param2)"></button>
Run Code Online (Sandbox Code Playgroud)
onClick是在承载按钮元素的组件上声明的函数.
我想做的是写一些类似的东西:
<button (click)="onClick(param1, param2)" online-only></button>
Run Code Online (Sandbox Code Playgroud)
并有一个指令,如:
@Directive({
selector: '[online-only]',
})
export class OnlineOnlyDirective {
@HostListener('click', ['$event'])
onClick(e) {
if(someCondition){
e.preventDefault();
e.stopPropagation();
}
}
}
Run Code Online (Sandbox Code Playgroud)
但是首先执行click handler,因此不会给我的指令停止执行.
我想到的第二种方法是用我自己的处理程序替换(单击)例如([onlineClick] ="onClick")并在指令认为合适时执行传递的函数,但这样我就无法将params传递给onClick函数并且有点我们要看看.
做这样的事情你有什么想法吗?
到目前为止,我试图做到以下几点失败.
我有一个以分号分隔的字符串.说一个电子邮件列表,所以
'email1@example.com;email2@example.com;email3@example.com'
Run Code Online (Sandbox Code Playgroud)
我想要完成的是将此字符串(使用split(';'))拆分为字符串数组或对象数组(以帮助绑定).我想要绑定到不同输入元素的每个项目.编辑后我想再次读取连接值以发送到我的后端.
问题是当编辑其中一个分割输入时,原始项目值不会更新(这是有意义的,因为我猜测单个项目是原始部分的副本),但我想知道是否有办法做某事像那样.请注意,我希望这两种方式,所以观看单个输入并手动更新原始输入,只会触发无限循环的更新.
我尝试了几种不同的方法,包括使用Object.defineProperty创建一个item属性get/set来读取和右边的字符串(set永远不会被触发).
我在他们自己的解决方案和存储库中定义了几个 azure 工作者角色项目。为了模拟云环境,我必须在本地运行其中几个工作程序。为每个工作人员打开一个 Visual Studio 实例不是一个可行的选择,我想要一个允许同时工作不同工作人员并能够根据需要扩展每个工作人员角色的解决方案。
有没有办法触发 azure 计算模拟器从命令行启动角色?
如果没有,如何编写一个控制台应用程序来触发工作线程的 onstart、run 和 onstop 方法。在这种情况下,我不确定这样的解决方案对工作者多线程有什么影响,以及是否可以扩展每个工作者角色。
一般来说,是否有在开发机器上模拟复杂云环境的最佳实践(在合理范围内)?
到目前为止,我正在使用打字稿内部模块,并包含10个脚本标签来引导我的应用程序.我目前正在将项目转换为使用外部模块(使用browserify),但我仍然坚持要如何转换枚举.
我曾经有类似的东西:
mymodule.submodule {
enum MyEnum {
one,
two,
three
}
}
Run Code Online (Sandbox Code Playgroud)
我会在其他模块中使用它:
var val:mymodule.submodule.MyEnum = mymodule.submodule.MyEnum.one;
Run Code Online (Sandbox Code Playgroud)
并且这正确编译为js.在将项目转换为使用外部模块之后,我将所有接口都移动到*.d.ts文件中,并考虑将枚举放在那里,但当然这会产生错误,因为在js中枚举和数字之间没有映射.然后我将枚举移动到*.ts文件,以便编译它们.问题是如果我把它们写成:
export enum MyEnum{
one,
two,
three
}
export enum OtherEnum {
four,
five,
six
}
Run Code Online (Sandbox Code Playgroud)
这适用于要求我的代码中的枚举如下:
import Enums = require('./enums');
var val = Enums.MyEnum.one; //this works
var val1: mymodule.submodule.MyEnum = Enums.MyEnum.one; //ERROR: incompatible types
Run Code Online (Sandbox Code Playgroud)
但是与mymodule.submodule.MyEnum类型不兼容.那么我怎样才能同时拥有枚举类型的声明,这样我就可以在d.ts文件中声明变量类型,还可以依赖实际生成的枚举代码(以便正确加载)并在.ts文件中使用?
注意:这些枚举用于许多模块,因此将它们包含在同一文件中并不是解决方案.
关于接口声明的更新:可能不清楚为什么我在d.ts文件中保留原始枚举声明,所以我要添加一个示例.
在interfaces.d.ts我目前有:
declare module mymodule.submodule {
enum MyEnum{
one,
two,
three
}
interface ISomething{
aValue: MyEnum;
aFunction: (anArg: MyEnum) => void;
} …Run Code Online (Sandbox Code Playgroud) 我正在尝试为框模型属性设置CSS变量。我要支持为所有方面以及各个方面设置值。我想拥有默认值,但是无论哪种方式都可以覆盖。我尝试使用后备值,但收效甚微。
就像是:
:root {
--border-width-top: 0;
--border-width-right: 0;
--border-width-bottom: 0;
--border-width-left: 0;
--border-width: 0;
}
div {
border-color: red;
border-style: solid;
border-width: var(--border-width, var(--border-width-top) var(--border-width-right) var(--border-width-bottom) var(--border-width-left));
}
div {
--border-width-top: 10px;
}
Run Code Online (Sandbox Code Playgroud)
如果border-width具有默认值,则它将无法正常工作,那么它将始终优先于后备值。不确定目前有没有办法做到这一点,但是我觉得已经很接近找到解决方案了。
这是我正在玩的一个堆叠闪电战: stackblitz
angularjs ×4
javascript ×3
typescript ×2
angular ×1
browserify ×1
c# ×1
css ×1
css3 ×1
emulation ×1
ionic2 ×1
string ×1
user-input ×1