在构建和打包Angular 6库时,我似乎无法指示Angular CLI将库的资源复制到dist/assets每个构建的文件夹中.
假设项目的文件夹结构是这样的 -
- dist
- e2e
- node_modules
- projects
- lib1
- src
- lib
- assets
- icons
- src
Run Code Online (Sandbox Code Playgroud)
当我运行ng build lib1或ng build lib1 --prod在assets/icons文件夹不被复制到dist/lib1/assets/icons.
如果我跑ng build那么src/assets(根SRC /资产)被复制,但没有projects/lib1/assets.
该angular.json文件包含"assets": ["src/assets"]对它的引用,但它不允许将assets密钥专门添加到项目中,只允许添加到主根应用程序.添加时,我收到以下错误:
架构验证失败,出现以下错误:数据路径""不应具有其他属性(资产).
我还尝试将以下自定义复制规则添加到资源,以将资产复制到dist/lib而不是dist/appname:
"assets": [
"src/favicon.ico",
"src/assets",
{ "glob": "**/*", "input": "src/assets/icons", "output": "../lib1/assets/icons" }
],
Run Code Online (Sandbox Code Playgroud)
但是我收到以下错误:
无法将资产写入输出路径之外的位置.
是否有在每个构建中管理库资产副本的内置方法?
更新06/05/2018
我向Angular CLI提出了一个问题,但尚未收到回复.问题#11701
在角度5+中使用自定义HttpInterceptors时,我收到以下奇怪的依赖注入行为.
以下简化代码工作正常:
export class AuthInterceptor implements HttpInterceptor {
constructor(private auth: AuthService) {}
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
const token = this.auth.getToken();
return next.handle(req);
}
}
export class AuthService {
token: string;
constructor() {
console.log('AuthService.constructor');
}
}
Run Code Online (Sandbox Code Playgroud)
然而....
当AuthService具有1个或更多依赖性时,例如
export class AuthService {
token: string;
constructor(private api: APIService) {
console.log('AuthService.constructor');
}
}
Run Code Online (Sandbox Code Playgroud)
angular尝试重复创建新实例,AuthService直到收到以下错误:
日志显示AuthService.constructor消息~400次
和
Cannot instantiate cyclic dependency! HTTP_INTERCEPTORS ("[ERROR ->]"): in NgModule AppModule
和
app.component.html:44错误RangeError:超出最大调用堆栈大小
然后我尝试使用Injector类注入服务 -
export class AuthService {
token: …Run Code Online (Sandbox Code Playgroud) 我在使用Angular 6时从延迟加载的模块加载组件时遇到问题.
我使用CLI创建了一个库 -
ng generate library @org/chat
更新的angular.json文件包括:
"lazyModules": [
"dist/org/chat"
],
Run Code Online (Sandbox Code Playgroud)
然后通过AppComponent成功加载模块:
constructor(private _injector: Injector, private loader: SystemJsNgModuleLoader, public dialog: MatDialog) {}
load() {
this.loader.load('dist/org/chat#ChatModule').then(moduleFactory => {
const moduleRef = moduleFactory.create(this._injector);
});
}
Run Code Online (Sandbox Code Playgroud)
到目前为止一直很好,模块正在加载.
但是,ChatModule有一个名为ChatPopupComponent的组件,我找不到使用对话框(或通过将其添加到ViewChild容器)来显示它的方法.
要在对话框中打开组件,需要在模块的entryComponents下声明并在AppComponent级别导入:
let dialogRef = this.dialog.open(ChatPopupComponent
data: {}
});
Run Code Online (Sandbox Code Playgroud)
但是当直接导入组件(并从库中导出)时,我得到以下(明显的)错误:' Component ChatPopupComponent is not part of any NgModule or the module has not been imported into your module'.由于它是一个延迟加载的模块,它显然还没有导入.
当我尝试以下内容时:
let name: any = 'ChatPopupComponent';
let dialogRef = this.dialog.open(name
data: {}
}); …Run Code Online (Sandbox Code Playgroud) 我正在使用Laravel 5.1并尝试为开发和生产环境设置不同的日志记录逻辑.
在我的整个应用程序中,我使用了Log大多数以下不同方法的外观:
Log::emergency($error);
Log::alert($error);
Log::critical($error);
Log::error($error);
Log::warning($error);
Log::notice($error);
Log::info($error);
Log::debug($error);
Run Code Online (Sandbox Code Playgroud)
然而,在我的生产环境,我想只记录任何是Error,Critical,Alert或Emergency优先级和无视登录请求优先级较低.
我在文档中找不到任何东西,或者通过探索代码(Log外观和Monolog类).
我目前的想法是在Log外观周围创建一个自定义包装器,它只是检查环境并忽略400以下的任何内容(Monolog级别为Error).基本上我会在环境文件中创建一个阈值变量,其下面的任何内容都不会记录到文件中.
在我这样做之前,我想询问社区是否存在我可以使用的现有方法/配置,以便我不重新发明轮子.
如果不是 - 最好的方法是什么?
在使用Angular CDK并开发自定义组件时,我正在尝试用ngIf和实现交错动画ngFor.动画是一系列简单的淡入.
以下简化的HTML:
<button (click)="visible = !visible">Toggle</button>
<div class="parent" @parentAnimation *ngIf="visible">
<p class="child">Child 1</p>
<p class="child">Child 2</p>
<p class="child">Child 3</p>
</div>
Run Code Online (Sandbox Code Playgroud)
和组件:
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: [ './app.component.css' ],
animations: [
trigger('parentAnimation', [
transition('void => *', [
query('.child', style({opacity: 0})),
query('.child', stagger('500ms', [
animate('100ms .1s ease-out', style({opacity: 1}))
]))
]),
transition('* => void', [
query('.child', style({opacity: 1})),
query('.child', stagger('500ms', [
animate('100ms .1s ease-out', style({opacity: 0}))
]))
])
])
]
})
export class AppComponent { …Run Code Online (Sandbox Code Playgroud) 这是关于性能和最佳实践的问题.
假设我有一个封装了大量辅助方法的js对象.该对象被视为静态类,这意味着它永远不会被实例化,并且它的所有方法基本上都是辅助方法.当使用事件和jQuery,该对象的this范围不断变化,并且由于它有相当多的我想知道的方法什么是最好的做法-节能this成_this在每个方法的开头或简单地使用对象名称MyObject.
多年来,我一直在做两件事,当涉及到singelton /静态物体时,但我认为必须有一个最佳实践,而且是采用最佳方法的时候了.
我目前的研究表明,使用_this而不是直接调用MyObject所带来的好处主要是以下两点:
_this将始终有效MyObject每次的范围.使用优点MyObject:
this申请者)MyObject总是有效,所以更容易重构代码我想知道是否有一种全局保存的方法_this(仅在对象的范围内)并避免在每个方法的开头分配它.如果没有 - 是否还有其他优缺点,或者我认为直接调用对象名称是不好的做法.
这是一个简化的参考对象(真实对象有更多的方法).
var MyObject = {
init: function() {
this.registerEvents();
//other stuff
},
registerEvents: function() {
this.registerOnSomeEvent();
//registering more events..
//...
},
registerOnSomeEvent: function() {
var _this = this;
jQuery('#someid').click(function() {
_this.doSomething();//option 1
MyObject.doSomething();//option 2
});
},
doSomething: function() {
//doing something... …Run Code Online (Sandbox Code Playgroud) 我们有多个Angular项目,我们希望将它们快速上传到s3进行质量检查和测试。我们将它们全部上传到相同子桶中的不同子文件夹中。因此s3存储桶结构如下:
-- tests-bucket
-- project1
-- index.html
-- project2
-- index.html
Run Code Online (Sandbox Code Playgroud)
然后,我们有一个云前端分布和route53设置,例如tests.domain.com。
通过完整路径访问项目时,一切正常:
tests.domain.com/project1/index.html
tests.domain.com/project2/index.html
Run Code Online (Sandbox Code Playgroud)
但是,当我们尝试不使用index.html(tests.domain.com/project1或tests.domain.com/project1/)访问项目时,会出现以下错误:
<Error>
<Code>NoSuchKey</Code>
<Message>The specified key does not exist.</Message>
<Key>index.html</Key>
<RequestId></RequestId>
<HostId></HostId>
</Error>
Run Code Online (Sandbox Code Playgroud)
这使我们很难测试,因为在初始页面加载后,index.html会自动删除,并且任何其他重新加载都会导致404错误。
该存储段设置为服务网站静态托管,索引和错误文档均指向index.html。
CloudFront发行版还设置为将404错误路径重定向到index.html。
似乎此设置仅适用于存储桶的根路径,tests.domain.com/index.html但不支持子目录。
这篇AWS文章似乎有可能,但是在我们的情况下,它不适用于SPA / Angular应用程序。
通过对此的快速研究,我找到了本教程,该教程使用Lamda Edge重定向解决了此问题,但该设置似乎有些过头,而且似乎仅支持美国东部发行。
是否有任何简单的配置可以解决此问题,仅使用不涉及lambda函数的s3 / cloudfront / route53?
假设我有以下MySQL表来表示pricebooks,items及它们之间的关系:
item - item_id|name|...etc
pricebook - pricebook_id|name|...etc
Run Code Online (Sandbox Code Playgroud)
和以下 pivot table
pricebook_item - pricebook_id|item_id|price|...etc
Run Code Online (Sandbox Code Playgroud)
我有相关雄辩型号:Pricebook,Item和库命名PricebookData,以获取必要的信息.
在PricebookData存储库中,我需要按价格手册ID分组价格手册数据,然后通过item_id键入,以便在客户端轻松访问.
如果我做:
Pricebook::all()->groupBy('pricebook_id');
Run Code Online (Sandbox Code Playgroud)
我得到的信息按照pricebook_id每个价格手册中的内容分组,键是简单的数字索引(它以js数组的形式到达),而不是实际的product_id.因此,当返回到客户端Javascript时,结果如下:
pricebookData: {1: [{}, {}, {}...], 2: [{}, {}, {}...]}
Run Code Online (Sandbox Code Playgroud)
价格作为数组到达的问题是,如果不迭代数组,我就无法轻松访问它.理想情况下,我可以收到它:
pricebookData: {1: {1001:{}, 1002: {}, 1003: {}}, 2: {1001:{}, 1002: {}, 1003: {}}}
//where 1001, 1002, 1003 are actual item ids
//with this result format, I could simply do var price = pricebookData[1][1001]
Run Code Online (Sandbox Code Playgroud)
我也试过以下但没有成功:
Pricebook::all()->keyBy('item_id')->groupBy('pricebook_id');
我试图避免的相当于:
$prices = Pricebook::all();
$priceData = []; …Run Code Online (Sandbox Code Playgroud) 我正在使用Laravel 5.1并尝试在用户打开记录编辑视图时实现记录锁定,以便任何其他用户无法打开同一记录的编辑视图,直到锁定被释放.
很明显,用户永远不会完成编辑,因此我需要能够自动解锁记录(当用户进行任何其他事务时,或者在超时事件之后,或者使用ajax后台保持活动状态).
我已经查看了lockForUpdate()有关InnoDB锁定功能的内容,但我无法获得有关它的真实信息(搜索超过20个帖子,他们似乎都没有真正的信息相互背诵).文档也没有提供太多信息,探索Laravel Query Class代码让我获得了以下进展:
看起来术语和mysql(innodb)锁定实际上存在很大的混淆,或者它可能只是我试图解决这个问题.
长话短说,InnodDB/Laravel锁定的主要警告(根据我的需要)是它不持久,因此当php脚本终止并且用户仍在编辑表单时它将自动重置.它仅适用于交易.
我需要实现上述功能(编辑签入/签出),在我重新发明轮子之前,我很想知道是否已经内置了Laravel/PHP功能.
如果没有,我正在考虑以下方法,并希望得到关于哪一个是最好的输入.
A. edit_checkins使用record_id,user_id,timestamp 创建一个表.
B. locked_at在记录表中添加一个列,该列将保存时间戳或null(类似于deleted_at列).
我主要担心的是性能和"垃圾收集",因为有时候记录被锁定但从未主动解锁.使用方法AI可以edit_checkins在简单查询中从表中删除所有用户锁.但是在检查记录是否被锁定时会慢一点,因为我必须进行表连接(我认为它应该可以忽略不计,因为编辑事件比其他事件更少).使用方法B检查更快但我没有获得所有信息(例如user_id)并且在不知道user_id的情况下实现解锁所有事件更难以几乎不可能(我可能需要locked_by同时在记录中添加一列).
我希望我的问题足够清楚.感谢您的时间.
angular ×4
laravel ×3
angular6 ×2
javascript ×2
mysql ×2
php ×2
amazon-s3 ×1
angular-cli ×1
angular5 ×1
eloquent ×1
group-by ×1
jquery ×1
laravel-5 ×1
lazy-loading ×1
logging ×1
monolog ×1
ng-packagr ×1
oop ×1
this ×1
typescript ×1