小编Edr*_*ric的帖子

角度材料 - 扁平树和嵌套树之间的差异

平树:

在平面树中,层次结构是扁平的; 节点不会在彼此内部呈现,而是按顺序呈现为兄弟节点

嵌套树:

在嵌套树中,子节点放在DOM中的父节点内.父节点有一个插座,用于保留所有子节点.

我有一个800元素的命名法,我用平面树显示.
我首先尝试使用嵌套树,因为它看起来像是最合适的树.它需要眨眼才能构建它,但是DOM需要5秒才能加载树,所以我尝试了扁平的树,它现在完美地工作了.

问题是,如果扁平树的结果相同,那么使用嵌套树有什么意义呢?树正确呈现,DOM理解其层次结构.

平树的DOM:

平树的DOM

嵌套树更难构建,并且每次显示时都会明显重载DOM.嵌套树可以做什么,平树不能做什么?材料文档不清楚.

tree typescript angular-material angular

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

Material UI Button 移除焦点框

有没有办法移除 Material UI 按钮的焦点框?

我尝试添加一个CSS类.focusframebox-shadow: none,但是这似乎并没有删除对焦框。单击时,该按钮将保留此红色焦点框。

带有按钮渲染的 TypeScript 类:

export class App extends React.Component<AppProps, AppState> {
    public componentDidMount() {
        this.setState({sessionLoaded: true});
    }

    public render() {
        if (this.state) {
            return <div>
                <Button className='focusframe' onClick={() => console.log("Material UI Button clicked!")} color='primary' variant='contained'>Click Me!</Button>
            </div>;
        } else {
            return <div>State not yet accessible.</div>;
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

SCSS 类:

@import "~bootstrap/scss/bootstrap";
@import "_colors.scss";

body {
    background-color: $body-color-base;
    color: $body-color-font;

    .focusframe {
        box-shadow: none;
    }
}
Run Code Online (Sandbox Code Playgroud)

点击按钮前:

在此处输入图片说明

点击按钮后:

在此处输入图片说明

编辑1:

按钮的 HTML: …

sass typescript material-ui

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

如何使用 HILT 将 Repository 实例提供到 Firebase 消息传递服务类中

我在我的项目中使用 HILT 设置了 DI。现在我必须集成 FCM 推送通知,因此我必须向 Firebase 消息传递服务类提供存储库实例,以便在调用新令牌时将新的 fcm 令牌更新到服务器(从服务类执行 api 调用)。我该如何做到这一点以及最佳实践是什么?

应用程序模块

@Module
@InstallIn(ApplicationComponent::class)
class ApplicationModule {

    @Provides
    @Singleton
    fun provideServiceTokenAuthenticator(sharedPreferences: SharedPreferences,
        @ApplicationContext appContext: Context,chatManager: ChatManager): ServiceTokenAuthenticator =
        ServiceTokenAuthenticator(sharedPreferences, appContext,chatManager)


    @Provides
    @Singleton
    fun provideApiService(okHttpClient: OkHttpClient): ApiService {
        return Retrofit.Builder().baseUrl(BuildConfig.BASE_URL)
            .addConverterFactory(GsonConverterFactory.create())
            .addCallAdapterFactory(RxJava3CallAdapterFactory.create()).client(okHttpClient).build()
            .create(ApiService::class.java)
    }

    @Provides
    @Singleton
    fun provideOkHttpClient(serviceTokenAuthenticator: ServiceTokenAuthenticator,sharedPreferences: SharedPreferences): OkHttpClient {
        val loggingInterceptor = HttpLoggingInterceptor()
        loggingInterceptor.level = HttpLoggingInterceptor.Level.HEADERS
        loggingInterceptor.level = if (BuildConfig.DEBUG) HttpLoggingInterceptor.Level.BODY else HttpLoggingInterceptor.Level.NONE

        return OkHttpClient.Builder().connectTimeout(2, TimeUnit.MINUTES)
            .readTimeout(2, TimeUnit.MINUTES).writeTimeout(2, TimeUnit.MINUTES)
            .addInterceptor(object : Interceptor {
                override fun intercept(chain: Interceptor.Chain): …
Run Code Online (Sandbox Code Playgroud)

android dependency-injection kotlin firebase dagger-hilt

10
推荐指数
2
解决办法
3495
查看次数

如何强制停止Android应用

如何使用Java代码强制停止应用程序?我正在尝试构建一个内存清理器,它可以帮助清理后台进程.强制停止的意思是确保当您转到应用程序详细信息时,FORCE STOP按钮显示为灰色.我知道有一种方法可以杀死应用程序,但是当你进入运行列表时,即使你杀了它,应用程序仍然存在.我已经尝试了很多类似的内存清理应用程序,其中只有一个可以完全FORCE STOP应用程序,但它有很多无用的通知 - 非常烦人.

PS:当你去__CODE__,你可以看到一个应用程序列表,点击其中一个,你可以获得它的应用程序信息.有一个名为FORCE STOP的按钮.通过点击它,该应用程序完全被杀死.我想在我的应用程序中执行这种操作,是否有任何代码片段可以执行此操作?

强制停止的例子

java android process

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

使用Angular材质创建响应式工具栏

我使用Angular Material创建了一个工具栏.但是,它没有响应.如何使工具栏响应?

工具栏代码:

<md-toolbar color = "primary">
    <button md-button class="md-primary" [routerLink]="['/basic']"><md-icon class = "icon-20">home</md-icon> &nbsp;Angular Concepts</button>
    <button md-button [mdMenuTriggerFor]="bMenu">Basic Concepts</button>
    <md-menu #bMenu="mdMenu">
      <button md-menu-item [routerLink]="['/a4']">Angular Component</button>
      <button md-menu-item [routerLink]="['/cli ']">Angular CLI</button>
      <button md-menu-item [routerLink]="['/inout']">Event Emitters</button>
      <button md-menu-item [routerLink]="['/template']">Template Driven Forms</button>
      <button md-menu-item [routerLink]="['/reactive']">Data Driven Forms</button>
      <button md-menu-item [routerLink]="['/directives']">Angular Custom Directives</button>
      <button md-menu-item [routerLink]="['/pipes']">Custom Pipes</button>
      <button md-menu-item [routerLink]="['/viewchild']">View Child</button>
      <button md-menu-item [routerLink]="['/view']">View Encapsulation</button>
    </md-menu>

    <button md-button [mdMenuTriggerFor]="aMenu">Advanced Concepts</button>
    <md-menu #aMenu="mdMenu">
      <button md-menu-item [routerLink]="['/ngrx']">Angular Redux using ngrx/store</button>
      <button md-menu-item [routerLink]="['/guard']">Angular Guards</button>
      <button …
Run Code Online (Sandbox Code Playgroud)

angular-material2 angular

9
推荐指数
3
解决办法
3万
查看次数

使用 jq 从 JSON 对象中删除键:值

我正在尝试使用 jq 从 JSON 对象中添加和删除“键:值”。我是使用 jq 的新手,我不明白 jq 向我抛出的错误,因此非常感谢将我推向正确方向的任何帮助。我的具体问题是我有一个 JSON 对象(如下),我希望能够从 JSON 对象中添加/删除“maxHeight”键/值。

我尝试过的一些命令遇到了错误……

jq 'recurse(.[]) |= del(.maxHeight)' new.json   
Run Code Online (Sandbox Code Playgroud)

无法迭代 null (null)

 jq 'recurse(.[]) |= {maxHeight}' new.json
Run Code Online (Sandbox Code Playgroud)

无法迭代字符串(“功能”)

jq 'recurse(.[]) |= .maxHeight' new.json 
Run Code Online (Sandbox Code Playgroud)

不能用字符串“style”索引字符串

new.json 文件看起来像这样...

{
  "style": {
    "className": "feature",
    "showLabels": false,
    "color": "function(feature, variableName, glyphObject, track){if(feature.get(\"type\") === \"CDS\"){return \"#9CFBF5\";} else if(feature.get(\"type\") === \"exon\"){return \"#43A47F\";} else if(feature.get(\"type\") === \"intron\"){return \"#E8E8E8\";} else if(feature.get(\"type\") === \"five_prime_UTR\"){return \"#F192FE\";} else if(feature.get(\"type\") === \"three_prime_UTR\"){return \"#FEC892\";} else {return \"#FF0000\";}}",
    "arrowheadClass": null,
    "featureCss": "padding:3px;"
  },
  "menuTemplate": …
Run Code Online (Sandbox Code Playgroud)

json jq

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

如何更改Angular Material中的滚动条样式?

我们需要帮助更改Angular Material中Select组件中的滚动条.

以下演示已实施.

https://stackblitz.com/angular/bxbvndrpogl?file=app%2Fselect-reset-example.ts

MAT-选择

但是,我需要帮助改变滚动条的宽度和样式.

typescript angular-material angular

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

Flutter 如何处理嵌套的 InkWell?

假设您有几个嵌套的InkResponse,如果您点击内部的 ,则所有父级实际上都会触发飞溅效果,即使它们会在点击区域中为正确点击的小部件松散。效果将是这样的:

例子

如何防止此类行为?如何仅为点击的小部件显示飞溅?在此示例图像中,它使用了Container> Row(带InkReponse)> Icon(也带InkResponse)。如果您使用材质按钮,也会发生这种情况。

dart flutter

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

如何在`mat-datepicker`中添加清除按钮

如何在mat-datepicker. 正是在打开日历中如何添加日期清理按钮。

<input matInput [(ngModel)]="data1" [matDatepicker]="data1" [value]="" formControlName="data1" id="data1" name="data1">
<mat-datepicker-toggle matSuffix [for]="data1"></mat-datepicker-toggle>
<mat-datepicker #data1></mat-datepicker>
Run Code Online (Sandbox Code Playgroud)

我把里面的属性:

<input matInput [(ngModel)]="data1" [matDatepicker]="data1" [value]="" formControlName="data1" id="data1" name="data1">
<mat-datepicker-toggle matSuffix [for]="data1"></mat-datepicker-toggle>
<mat-datepicker #data1>
    <button (click)="onClickMe()">
        <mat-icon matDatepickerToggleIcon>clear</mat-icon>
    </button>
</mat-datepicker>
Run Code Online (Sandbox Code Playgroud)

但它不起作用。

我会寻求帮助。谢谢你。

angular-material angular

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

Angular 9 如何修复导出 'CDK_TABLE' 在 '@angular/cdk/table' 中找不到

刚刚从 8 迁移到 9。一步一步地完成所有事情,我正在使用角材料,也迁移了它,从@angular/material -> @angular/material/table更改了所有路径。现在,当我运行 ng serve 时,出现此错误:

ERROR in ./node_modules/@angular/material/__ivy_ngcc__/fesm2015/table.js 55:23-32
"export 'CDK_TABLE' was not found in '@angular/cdk/table'
Run Code Online (Sandbox Code Playgroud)

包.json :

  "dependencies": {
    "@angular/animations": "9.0.7",
    "@angular/cdk": "9.1.3",
    "@angular/common": "9.0.7",
    "@angular/compiler": "9.0.7",
    "@angular/core": "9.0.7",
    "@angular/fire": "^5.2.3",
    "@angular/forms": "9.0.7",
    "@angular/material": "^9.1.3",
    "@angular/material-moment-adapter": "^9.2.0",
    "@angular/platform-browser": "9.0.0",
    "@angular/platform-browser-dynamic": "9.0.7",
    "@angular/platform-server": "9.0.7",
    "@angular/pwa": "^0.901.0",
    "@angular/router": "9.0.7",
    "@angular/service-worker": "9.0.7",
    "@kolkov/angular-editor": "^1.0.2",
    "@ngmodule/material-carousel": "^0.6.0",
    "@nguniversal/express-engine": "^9.1.0",
    "@ngx-translate/core": "^12.1.2",
    "@ngx-translate/http-loader": "^4.0.0",
    "@nicky-lenaers/ngx-scroll-to": "^3.0.1",
    "@squadette/hammerjs": "^2.1.0-pre3",
    "@types/core-js": "^2.5.3",
    "bootstrap": "^4.4.1",
    "compression": "^1.7.4",
    "core-js": "^3.6.4",
    "dotenv": "8.2.0", …
Run Code Online (Sandbox Code Playgroud)

typescript angular-material angular

9
推荐指数
2
解决办法
8812
查看次数