标签: ionic3
如何访问 ion-input 指令包围的输入框的值
我是离子的新手。我正在使用 Ionic 框架 3。我的问题是我不知道如何访问 ion-input 指令包围的输入值。我想访问我创建的自定义指令的输入框的值。
ElementRef对获取输入框的值有帮助吗？我尝试过但失败了。请指导我访问自定义指令中输入框的值的正确方法。下面是我的代码...
我的自定义指令代码-电话号码
import { Directive, HostListener, ElementRef } from '@angular/core';
/**
* Generated class for the PhonenumberDirective directive.
*
* See https://angular.io/api/core/Directive for more info on Angular
* Directives.
*/
@Directive({
selector: '[phonenumber]' // Attribute selector
})
export class PhonenumberDirective {
constructor(private element: ElementRef) {
console.log('Hello PhonenumberDirective Directive');
}
@HostListener('keydown', ['$event']) onkeydown(event) {
let inputValue = this.element.nativeElement.textContent;
// Here inputValue is undefined I am getting :-(
}
}
HTML 代码
<ion-list inset> …mobile-application typescript angular-directive ionic3 angular
推荐指数
解决办法
查看次数
无法绑定到“videoId”，因为它不是“youtube-player”的已知属性
我正在使用 Ionic 3 和 Angular 5。我正在将 Youtube 视频嵌入到我的应用程序中，为此，我正在使用ngx-youtube-player. 但它给了我错误：
模板解析错误：无法绑定到“videoId”，因为它不是“youtube-player”的已知属性。1. 如果“youtube-player”是 Angular 组件并且具有“videoId”输入，则验证它是否是该模块的一部分。2. 如果“youtube-player”是 Web 组件，则将“CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“@NgModule.schemas”以抑制此消息。3. 要允许任何属性，请将“NO_ERRORS_SCHEMA”添加到该组件的“@NgModule.schemas”。(" ][videoId]="fetch.video_id_" (ready)="savePlayer($event)" (change)="onStateChange($event)"> [错误 ->]) 在 JitCompiler._compileComponents (vendor.js: 114542）在vendor.js：114412在Object.then（vendor.js：81363）在JitCompiler._compileModuleAndComponents（vendor.js：114411）
我的 app.module.ts 是：
import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';
import { SuperTabsModule } from 'ionic2-super-tabs';
import { YoutubePlayerModule } from 'ngx-youtube-player';
import { MyApp } …推荐指数
解决办法
查看次数
离子 - 电容器构建
我正在将 Ionic 3 应用程序切换为使用 Capacitor。是像我们之前那样使用类似的东西来构建生产应用程序的方法吗--prod？
推荐指数
解决办法
查看次数
在 ios 中下载 ionic 3 的文件未显示在文件夹中
离子3
我正在使用#cordova-plugin-file-transfer，从 android 和 ios 中的 url 下载文件。对于 Android 来说，它运行良好。但对于 ios 应用程序，我遇到了问题。
文件下载成功，但我无法在 ios 设备上看到下载的文件。
这是我的 ios 代码=>
const transfer = this.transfer.create();
transfer.download(url, cordova.file.documentsDirectory + fileName).then(
entry => {
console.log(entry);
this.apiService.showError("Download Succeeded.");
this.commonService.dismissLoading();
},
error => {
console.log(error);
this.apiService.showError("Download Failed.");
this.commonService.dismissLoading();
}
)
有谁可以在这方面帮助我吗？
推荐指数
解决办法
查看次数
android.support.v4.content 和 android.support.annotations 不存在
Ionic 3 android 构建失败，并在 IonicWebViewEngine.java 和所有相机 java 文件（CameraLauncher.java、FileProvider.java 等）上出现错误。
我尝试过添加插件cordova-android-support-gradle-release，cordova-plugin-android-support-v4但似乎没有任何效果。
如果我查看Android Studio SDK 管理器 -> SDK 工具 -> 支持存储库，我会看到 Android 支持存储库 47.0.0 已安装。
离子 CLI：5.2.2
科尔多瓦 CLI：9.0.0
Android SDK工具：26.1.1
下面是我的 package.json
...
"dependencies": {
"@angular/animations": "5.2.9",
"@angular/common": "5.2.9",
"@angular/compiler": "5.2.9",
"@angular/compiler-cli": "^8.0.2",
"@angular/core": "5.2.9",
"@angular/fire": "^5.2.1",
"@angular/forms": "5.2.9",
"@angular/http": "5.2.9",
"@angular/platform-browser": "5.2.9",
"@angular/platform-browser-dynamic": "5.2.9",
"@ionic-native/app-center-crashes": "^5.8.0",
"@ionic-native/camera": "^4.20.0",
"@ionic-native/core": "4.12.0",
"@ionic-native/dialogs": "^4.20.0",
"@ionic-native/file": "^4.20.0",
"@ionic-native/file-transfer": "^5.8.0",
"@ionic-native/firebase": "^4.20.0",
"@ionic-native/firebase-authentication": "^5.8.0",
"@ionic-native/geolocation": "^4.20.0",
"@ionic-native/in-app-browser": "^4.20.0", …推荐指数
解决办法
查看次数
如何在同一页面上制作两个 Ionic 侧边菜单？离子
我正在制作一个离子项目，我想要一个左侧菜单和一个右侧菜单，以及中间的内容。
我的问题是我只能放置一个离子菜单。我尝试将两者都放置，但只出现一个。
我遇到的问题是我放置的位置，因为离子文档上的两个菜单都有一个。
这是我的代码：
菜单：1：
<ion-split-pane contentId="main" >
<!-- the side menu -->
<ion-menu side="start" menu-id="test1">
<ion-header>
<ion-toolbar>
<ion-title>Menu</ion-title>
</ion-toolbar>
</ion-header>
</ion-menu>
<!-- the main content -->
<ion-router-outlet id="main"></ion-router-outlet>
</ion-split-pane>
菜单2：
<ion-split-pane contentId="main" >
<!-- the side menu -->
<ion-menu side="start" menu-id="test1">
<ion-header>
<ion-toolbar>
<ion-title>Menu</ion-title>
</ion-toolbar>
</ion-header>
</ion-menu>
<!-- the main content -->
<ion-router-outlet id="main"></ion-router-outlet>
</ion-split-pane>
主要内容：
<ion-header>
<ion-toolbar>
<ion-title>Receitas</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-menu-button slot="start">TEste</ion-menu-button>
<ion-menu-button slot="end">TEste</ion-menu-button>
</ion-content>
这些位于单独的文件中。
我要这个 ：
但是当我运行该页面时，只显示一个菜单，即开始菜单。
推荐指数
解决办法
查看次数
Ionic 3 项目评估失败，包括 afterEvaluate {} 中的错误
晚上好\n有一个 ionic 3 应用程序，它使用 FCM 进行推送通知\n我安装了 android 8 平台\n当我尝试执行 cordova build 命令时，我收到错误：
\n项目评估失败，包括 afterEvaluate {} 中的错误。使用 --stacktrace 运行以获取 afterEvaluate {} 错误的详细信息。
\n失败：构建失败并出现异常。
\n其中：\nScript \xe2\x80\x98C:\\IONIC\\AlloPressing\\platforms\\android\\cordova-plugin-fcm-with-dependecy-updated\\starter-FCMPlugin.gradle\xe2\x80\x99 行：16
\n出了什么问题：\n评估脚本时出现问题。
\n无法对 null 对象调用 LastIndexOf() 方法
\n尝试：\n使用 --stacktrace 选项运行以获取堆栈跟踪。使用 --info 或 --debug 选项运行以获得更多日志输出。使用 --scan 运行以获得完整的见解。
\n在https://help.gradle.org获取更多帮助
\n1m 8s 内构建失败
\n配置项目：app\nc:\\IONIC\\AlloPressing\\platforms\\android\\gradlew：命令失败，退出代码为 1 错误输出：\n项目评估失败，包括 afterEvaluate {} 中的错误。使用 --stacktrace 运行以获取 afterEvaluate {} 错误的详细信息。
\n请问如何纠正这个问题？
\n推荐指数
解决办法
查看次数
离子3动画同时显示隐藏
我有一个离子卡，根据布尔值显示或隐藏的元素很少。
一切正常，但更改非常迅速，因此无法提供出色的用户体验。
离子卡看起来像：
<ion-card>
<img *ngIf="item.showActions == false" class="img-card" src="{{item.imgUrl}}"/>
<ion-card-content>
<ion-card-title>{{item.msg}}</ion-card-title>
</ion-card-content>
<ion-grid *ngIf="item.showActions == true" no-padding style="border-top: 0.5px solid #E7E7E7;border-bottom: 1px solid #E7E7E7">
<ion-row padding><ion-col><p>For this news you can take following actions</p></ion-col></ion-row>
<ion-row text-center>
<ion-col>
<br/>
<button ion-button clear small icon-left (click)="presentPopover($event)">Show
</button>
<h2>Create Task</h2>
<br/>
</ion-col>
</ion-row>
</ion-grid>
<ion-card>
因此item.showActions是一个布尔值，我会根据某些操作进行翻转。我希望这种过渡能够像翻转或淡入淡出一样顺利进行。
推荐指数
解决办法
查看次数
在离子框架中进行生产
最近，我使用ionic 3完成了一个项目，任何人都可以帮助我--aot或--prod，这使我们的产品更加完善。
cordova run android --aot
要么
cordova run android --prod
推荐指数
解决办法
查看次数
发布后的Ruby on Rails路由错误
我尝试从Ruby返回json时遇到问题。
这是我的控制器（parts_controller）。
def show()
@part = Part.find(params[:id])
unless @part.nil?
render json: @part
end
end
我的路由文件：
Rails.application.routes.draw do
root to: "home#index"
resources :parts
end
这是我从爱奥尼克（Ionic）获得的帖子方法。
postData()
{
let headers = new Headers();
headers.append('Content-Type', 'application/json');
let body = {
id: 1
};
this.http.post('http://localhost:3000/parts/1', JSON.stringify(body), {headers: headers})
.map(res => res.json())
.subscribe(data =>{
console.log(data);
});
}
如果我手动输入http：// localhost / 3000 / parts / 1，它将返回JSON，但是当我尝试通过邮寄方式获取它时，它会抛出：POST http：// localhost：3000 / parts / 1 404（Not找到）
我也有show和index方法的视图，谢谢您的宝贵时间。
推荐指数
解决办法
查看次数