ionic はクロスプラットフォーム アプリケーションを迅速に開発するためのフレームワークであり、多くの特徴があります:
低い学習コスト
フロントエンド開発者にとって、学習コストはそれほど高くありません。Angular を使用したことがある場合、学習コストはほとんどかかりません。
シンプルで使いやすい。
強力な CLI、開始 -> プラットフォーム -> ビルド -> 実行、完全なサービス コマンド ラインの完了、F5 の必要なし>
プルダウン リフレッシュ (イオン リフレッシャー)、プルダウン リフレッシュ (イオン リフレッシャー)、プルダウン リフレッシュなどの人気のインタラクティブ効果を簡単に実現できる、多くの強力な既製コンポーネントを提供します。アップロード/ウォーターフォール フロー (ion-infinite-scroll)、タブ (ion-tabs)、サイドバー メニュー (ion-side-menu) などをアップロードすると、これらの一般的な効果を実現するには、少しのコードを記述するだけで十分です。ネイティブ開発よりも速い
がこの扉を開きます。つまり、カメラを呼び出して撮影するなど、多数のネイティブ関数を使用できることになります。写真、戻るボタンへの応答、電話をかける、テキストメッセージを送る、電子メールを送る...すべてをわずか数行のコードで行うことができます
2015/11/1 は v1.1.0、現在 (2016/1/9) は v1.2.4、更新が速いということは、誰かがメンテナンスしていることを意味し、バグはすぐに修正できます
問題ではありません互換性がない場合は、問題を発見した後で詳細なドキュメントを提供しても問題ありません。
どの部分に問題があるかを判断するのは困難です
アニメーションの遅延、低い 端末エクスペリエンスはさらに悪化しており、最適化対策では通常、次の使用を推奨しますアニメーションが減り、影が減り、グラデーションが減ります...しかし、使用しないとあまりにも醜く、エクスペリエンスはネイティブ アプリケーションとは大きく異なります
変な質問の答えが見つからず、夜中にstackoverflowを覗いていたら…
angular の $http は送信できます。 jsonp リクエストであり、使用法は次のように jQuery と似ています:
// 请求数据$http.jsonp(sUrl).success(function(res){ // ...}).error(function(err){ // ...});
リクエストの宛先を指定する相対 URL または絶対 URL コールバックの名前は文字列 JSON_CALLBACK である必要があります。
例:
var sUrl = http://www.ayqy.net/app/rsshelper/index.php?callback=JSON_CALLBACK
いいえ、実際にリクエストされた URL のコールバック !== JSON_CALLBACK は密かに angular に置き換えられているため (ドキュメントでは説明されていません)、そのため背景は次のように記述する必要があります:
<?phpif (strpos($_SERVER["REQUEST_URI"], 'callback')) { $res = json_encode($res); // echo $_SERVER["REQUEST_URI"]; // /angular/test/http/main.php?callback=angular.callbacks._0 // $res = 'JSON_CALLBACK('.$res.')'; // 错的 $res = $_GET['callback'].'('.$res.')';}?>
<?php// getif ($_SERVER['REQUEST_METHOD'] === 'GET') { $res = '{'; // arg if (isset($_GET['arg'])) { $res .= '"arg": "'.$_GET['arg'].'", '; } // method if (strpos($_SERVER["REQUEST_URI"], 'callback')) { // echo $_SERVER["REQUEST_URI"]; // /angular/test/http/main.php?callback=angular.callbacks._0 $res .= '"arg": "'.$_GET['arg'].'", '; $res .= '"method": "jsonp"}'; // $res = 'JSON_CALLBACK('.$res.')'; // 错的 $res = $_GET['callback'].'('.$res.')'; } else { $res .= '"method": "get"}'; } echo $res;}// postelse if ($_SERVER['REQUEST_METHOD'] === 'POST') { // 直接拿拿不到，因为传过来的是json串 // echo $_POST['arg']; $jsonArg = file_get_contents('php://input'); if (isset($jsonArg)) { echo substr($jsonArg, 0, strlen($jsonArg) - 1).', "method": "post"}'; } else { echo '{"method": "post"}'; }}?>
素晴らしいニュースです。ありがとうございます。 「has-bouncing='true'」はネイティブ スクロールでは機能しません。back go jsscroll (overflow-scroll="false")
<🎜 に移動することで再度実行できましたが、正しいですか? >ブラウザで確認しただけなので、ネイティブスクロールでバウンスが解消されることを誰かが確認できれば、それは素晴らしいことです。
この機能は、私が持っていたカスタムの「プルリフレッシュ」メソッドに必要です。
3.複数のビュー間のデータ共有これは、複数のコントローラー間のデータ共有の問題です (通常、異なるビューは異なるコントローラーに対応します) もちろん、最も簡単な方法はグローバル変数 ($rootScope) を使用することですが、これは次のとおりです。より合理的な方法は、サービスまたはファクトリーを自分で作成し、必要に応じてデータ アクセス インターフェイスと依存関係の挿入 (
など) を提供し、URL データ共有を実現することです。非常にクリーンな sKey を渡すことで
<ion-content overflow-scroll="false" has-bouncing="true"></ion-content>
データ表示はテンプレートに記述されていますが、ページを開いた後にデータが到着していない場合、テンプレートはデータがないため、しばらくしてデータが到着すると、ビューが更新されておらず、空白のままであることがわかります。例:
.service('DataServ', ['$http', 'UIServ', function($http, UIServ) { // ... // 字典 var oDir = { // key: value }; function save(val) { var sKey = Date.now() + ''; oDir[sKey] = val; return sKey; } function get(sKey) { return oDir[sKey]; } return { // ... save: save, get: get };}]);データに値を割り当てる操作はコントローラーの範囲外になるため、現時点では次のようにビューの更新を通知する必要があります。
。
rss格式中会有
$content = (string)$item->children("content", true);// $encodedContent = $content->encoded;// $content->encoded返回转义过的html，比如把&转成&，一般用于<pre class="brush:php;toolbar:false">直接展示当然，前提是使用原生xml扩展（ $xml = simplexml_load_file($url); ）解析xml才会遇到这个问题，更多用法请查看 php – How to parse CDATA HTML-content of XML using SimpleXML? – Stack Overflow
需要使用一个cordova插件，cd进项目文件夹，然后：
ionic plugin add cordova-plugin-inappbrowser
安装完成后就可以调用了，不用修改配置文件，不用引入其他js，如下：
// openInBrowserwindow.open(‘http://example.com’, ‘_system’); Loads in the system browserwindow.open(‘http://example.com’, ‘_blank’); Loads in the InAppBrowserwindow.open(‘http://example.com’, ‘_blank’, ‘location=no’); Loads in the InAppBrowser with no location barwindow.open(‘http://example.com’, ‘_self’); Loads in the Cordova web view// testwindow.open(url, '_system'); // 系统默认浏览器// window.open(url, '_blank'); // 很丑的安卓内置浏览器// window.open(url, '_self'); // 同上
一般都用 _system ，另外两个实在太丑，更多内容请查看 Cordova InAppBrowser Plugin Example using ionic framework
P.S.黑屏白屏其实是同一个问题，但这个问题相当难解决，笔者花了快1天才搞定
ionic默认集成了 splashscreen 插件，这个cordova插件效果不是很完美，默认配置只在首次打开app时显示splash screen，但实际效果是：
When the app starts the splash screen shows for a few seconds as expected, and then the screen goes black for @1 second and then white for @2 seconds and then the main app page appears.
Is there any way to prevent the black and white pages appearing? I read somewhere that a black page appears when there is no splash page but I do have a splash page and it appears fine.
在 stackoverflow 找到了这个问题描述，简直太贴切了，但是单靠问题下面的回答无法解决白屏问题，还需要改配置文件
最初发现的现象是黑屏（把上面英文描述里的white换成黑），后来找到了原因：主视图容器 ion-nav-view 是空的，而它的背景色是 #000 ，所以修复方法是给里面塞个 ion-view ：
<!-- 内容 --><ion-nav-view> <!-- 防止启动时黑屏 --> <ion-view></ion-view></ion-nav-view>
或者添css，把 ion-nav-view 的背景色改成白色。但问题还没解决，黑屏问题变成白屏问题了，解决方案比较麻烦
把splashscreen插件降级到v2.0.0
v2.0.0之后的版本有bug，目前（2016/1/9）自带的版本是v3.0.0。先cd到项目文件夹，然后命令行：
// 删掉现有版本cordova plugin rm cordova-plugin-inappbrowser// 安装v2.0.0cordova plugin add cordova-plugin-inappbrowser
改配置文件MyApp/config.xml
<preference name="SplashScreen" value="screen"/><preference name="AutoHideSplashScreen" value="false"/><preference name="auto-hide-splash-screen" value="false"/><preference name="ShowSplashScreenSpinner" value="false"/><preference name="SplashMaintainAspectRatio" value="true" /><preference name="SplashShowOnlyFirstTime" value="false"/><preference name="SplashScreenDelay" value="10000"/>
取消自动隐藏（改为代码控制隐藏），把持续时间改为较大的值（10秒），设置每次打开应用都显示splash screen
P.S.默认只有 SplashScreen 和 SplashScreenDelay ，需要把其它的（ SplashMaintainAspectRatio 可选）都添上
改app.js
手动隐藏splash screen，在run里面添上
.run(['$rootScope', function($rootScope) { // init // $rootScope.isLoading = false; // hide splash immediately if(navigator && navigator.splashscreen) { navigator.splashscreen.hide(); } });}])这样就好了，不要延时调用hide，否则仍然会出现白屏（有些解决方案要求$timeout 50毫秒hide，仍然会出现白屏，不要这样做）
最怨念的问题结束了，看似简单的功能，想要有 完美的原生体验 却很难，奇奇怪怪的问题很难解决，目前可行的解决方案可能过段时间就不行了，可以查看 White page showing after splash screen before app load 感受一下
各种签名方法都过时了，目前（2016/1/9）可以用的签名方法如下：
在MyApp\platforms\android创建keystore
具体步骤请查看： Ionic toturial for building a release.apk
创建release-signing.properties文件
具体步骤请查看： How to automatically sign your Android apk using Ionic framework and Crosswalk
build
cd到项目文件夹，然后命令行 ionic build --release android ，成功后会生成2个东西，在MyApp\platforms\android\build\outputs\apk下，分别是android-armv7-release.apk和android-x86-release.apk，一般平板和PC用x86，手机用arm7，如果要上传google play的话，2个都要传，下载时有自动识别
至于crosswalk，提供了chrome内核，能让低端机支持高端东西，但会让apk 变大很多 （3.5M->23M），添上crosswalk后，感觉。。。嗯，变卡了，但为了支持低端机用户，一般都会添上crosswork
怎么说呢，快速开发很棒，后遗症很伤。
笔者从1月3号开始搞，1月8号中午release v1.0.0，靓照如下：
rsshelper
rsshelper
看着还不错吧，非卖品，不赠送~
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
