我们有一个有角度的项目在工作(待开发,还没有开始).它非常复杂,数据流复杂.此外,我们的应用程序中有两种用户.经理和用户.这些用户将看到类似的视图,但每个用户都有一些不同的自定义视图.经理可以按照您的想象获得更多功能.为了以可扩展的方式管理这个相当大而复杂的应用程序,我们遵循NX模式.即单个回购中的多个应用程序.最后,在单个回购中,我有以下应用程序.
大部分开发将在commonapp中完成,不同的视图和定制将分别在两者mngr-app和user-app.
我们也考虑ngrx在我们的国家管理申请中使用.我已经看过多个如何做到这一点的示例和教程.到目前为止一切都还可以.这部分仅供参考.
我们的问题在此之后开始.我们的业务团队还希望我们使用包含Web应用程序的Web视图开发iOS和Android应用程序(我忘了提到它是一个响应式Web应用程序).因此,我们所做的一切都将通过网络视图发送给移动用户.但是,业务团队也希望我们为移动应用程序开发一些自定义本机视图.
我们来看看下面的例子:(这是来自ngrx的例子)
当用户单击Add Book to Collection按钮时,[Collection] Add Book会将操作类型分派给商店,效果将按如下方式处理:
@Effect()
addBookToCollection$: Observable<Action> = this.actions$
.ofType(collection.ADD_BOOK)
.map((action: collection.AddBookAction) => action.payload)
.switchMap(book =>
this.db.insert('books', [ book ])
.map(() => new collection.AddBookSuccessAction(book))
.catch(() => of(new collection.AddBookFailAction(book)))
);
Run Code Online (Sandbox Code Playgroud)
这是Web应用程序的正常流程.
我们的业务团队希望我们为移动应用程序构建某种自定义逻辑,以便当用户在移动应用程序(iOS或Android)中导航到此页面时,不会将书籍添加到集合中,而是打开本机页面用户将在该本机页面上执行操作.我的意思是他们希望Web应用程序在移动应用程序中出现时表现不同.我可以if(window.nativeFlag === true)在Web应用程序中实现这一点.但是,这只是我们想要避免的肮脏黑客.因为,我们正在使用ngrx,rxjs我们觉得这可以用Observables rxjs和Actions 来完成ngrx.
到目前为止我们尝试的是暴露store和 …
如何以角度显示图像?
<div><img class="images" ng-src="{{./resources/img/new.png}}"/></div>
<div><img class="images" src="./resources/img/new.png"/></div>```
Run Code Online (Sandbox Code Playgroud) 最近,我们将应用服务器从JBoss EAP6.2升级到EAP7.0.
即使它运行非HA配置文件standalone.xml,JBoss 也会jboss.node.name在JSESSIONIDcookie 结束时添加.
例如,
春天引导产生JSESSIONID的tHSf9v23SSDBMqJ1O7XFJZ9....,当请求到达浏览器时,cookie成为tHSf9v23SSDBMqJ1O7XFJZ9.master:<jboss.node.name>导致一些兼容性问题.
我通过手动调用进行了一些实验response.addCookie.在这种情况下,它不会master为cookie 添加后缀.但是,如果Spring自己编写cookie,那么JBoss似乎会选择它并添加master后缀.我知道这个案子可能有点混乱(对我而言),我很乐意提供更多信息.
TL; DR:我的问题是如何将我的一些sass文件捆绑到单个sass文件中?
我一直在开发一个Angular组件库,我用ng-packagr打包它.我们称之为@my-lib/ngx-components.
我的lib的消费者将导入我的组件,如@my-lib/ngx-components/navbar.
我决定为组件添加主题支持.
例如,我有一个带有默认颜色(背景,文本,悬停等)的导航栏组件.我希望我的库的消费者能够用自己的主题覆盖这些颜色.这就是为什么我写了一个mixin接受$theme输入并覆盖一些css规则的原因如下(这是我所拥有的基本版本)
_navbar-theme.sass
@mixin navbar-theme($theme)
$primary-color: map-get($theme, primary-color)
$secondary-color: map-get($theme, secondary-color)
$color: map-get($theme, color)
.navbar
background-color: $primary-color
color: $color
&:hover
background-color: $secondary-color
Run Code Online (Sandbox Code Playgroud)
每个组件都有自己的*-theme.sass文件.
我也有全局_theming.sass文件,导入所有这些如下
_theming.sass
@import './components/navbar/navbar-theme'
@import './components/button/button-theme'
@import './components/dropdown/dropdown-theme'
Run Code Online (Sandbox Code Playgroud)
我想_theming.sass从我的lib 导出这个文件,所以人们可以在自己的sass文件中导入这个文件,@import '~@my-lib/ngx-components/theming'并开始使用所有mixin可用的文件.如果他们想拥有定制的navbar,button等等,他们应该能够使用这些mixin单进口秒.
我试图让它看起来像角度材料主题设置.
起初,我已经尝试过node-sass哪些已经存在于我的依赖项中.但是,它试图将sass构建为css,因此它省略了输出文件中的mixins.
然后,我看了一下角质材料做了什么.他们使用scss-bundle
我想"这正是我想要的." 但是,它需要scss文件,而不是sass文件.它无法读取sass文件.
然后,我想"好吧,我可以放弃sass并开始使用scss.如何将所有这些文件转换为scss而不用手工完成它们".然后,我找到了sass-convert …
我有一个反应形式,带有文本输入.为了便于访问我的打字稿,我声明:
get parentId(): FormControl {
return this.addForm.get("parentId") as FormControl;
}
Run Code Online (Sandbox Code Playgroud)
这部分工作,控件被正确访问.
现在我的ngOnInit如果我这样做:
this.parentId.valueChanges.subscribe(() => console.log("Changed"));
Run Code Online (Sandbox Code Playgroud)
正如预期的那样,在输入中更改的每个字符处执行控制台日志.但如果我这样做:
this.parentId.valueChanges.pipe(tap(() => console.log("Changed")));
Run Code Online (Sandbox Code Playgroud)
什么都没发生.没有错误,没有任何错误.我也尝试过使用map,switchMap等等.似乎管道对valueChanges不起作用.我在我的代码中的其他地方使用管道方法在不同的observables上没有任何问题.
我需要在这里使用管道去抖动,映射等.
知道我做错了什么吗?
- 编辑 -
这是Angular Material网站上的自动填充组件的代码示例:
ngOnInit() {
this.filteredOptions = this.myControl.valueChanges
.pipe(
startWith(''),
map(val => this.filter(val))
);
}
Run Code Online (Sandbox Code Playgroud)
最后没有订阅,示例有效.
angular ×4
rxjs ×2
angular-cli ×1
angular6 ×1
angularjs ×1
css ×1
gulp ×1
java ×1
jboss ×1
jsessionid ×1
ngrx ×1
observable ×1
sass ×1
spring-boot ×1
store ×1
webpack ×1
wildfly ×1