橋本技研ブログ売れるホームページ研究所、橋本技研の技術系備忘録ブログ。ショッピングカートシステムの制作などが得意です。ネットショップのプログラミングPHPの連想配列をJavascriptに引き渡す方法についての記事です。データを取得してバインドしていきますので、HTMLの読み込みから描画が完了するまでに、ワンテンポ待ち時間が発生してしまいます。このワンテンポの待ち時間を無くす必要にかられまして、Ajaxで読み込んでいたデータを、最初からHTML(PHPから出力)の中に埋め込んでAngular.jsに引き渡すという方法にトライしてみました。ng-initタグを通じてAngular.jsの関数に引数が渡るようにすれば良いわけです。して渡せばOKだよねと思って実装したところ、エスケープがうまくいかず少々ハマりましたのでその方法をここに書き記しておきたいと思います。PHPからJavascriptへデータを引き渡す方法HTMLの中にjavascriptを埋め込む場合、HTMLの表示が崩れないようにエスケープしなければなりません。addslashesやhtmlentities、htmlspecialcharsなどPHPにはエスケープ用の関数がたくさんありますが、今回はこんな組み合わせで実現しました。連想配列をJSON形式のテキストデータに変換します。JSONデータをrawurlencode関数でエンコードします。スクリプトに埋め込みます。受け取ったデータをdecodeURIComponent関数でデコードします。angular.fromJson関数で連想配列に戻します。以上で、PHP内の配列データをAngular.jsに引き渡すことが出来ました。bagooon橋本たかし★ホームページの制作(デザイン・コーディング・プログラミング)に加え、ネットショップの販売促進に関するアドバイスも致します。20年以上に渡って実際にネットショップを運営した経験を生かし、聞きかじりではない実績を伴ったノウハウを、自分の言葉でお伝えいたします。プログラミングの経験は30年以上。PHP、Ruby、Perl、JavaScript、Vue、Nuxt.JS、MySQL、Elasticsearch、サーバー構築、Dockerなど、幅広く対応します。瞬時に検索できるようになった。改元アニバーサリーの10連休中に、いつか勉強してみたいと思っていた、検索専用DBについて調べて、いろいろ遊んでみました。B2】6月19日出荷分から「配達時間帯」の指定枠が変わるので、B2の仕様変更についてヤマト運輸に問い合わせてみたネットでも話題になりましたが、ヤマト運輸の配達時間帯の指定枠が2017年6月19日発送分から変わります。「12時~14時」→廃止...記事を読む運営するネットショップで、200か所以上に発送する案件を頂いたので、受付作業を自動化してみた話。運営しているネットショップにおいて、200か所越えの宛先に商品を発送する案件を頂きました。配送先の情報については、すでにエクセルデー...記事を読むベジェ曲線について勉強してみました。画像を扱うプログラムを書いているのですが、文字を曲線に沿って配置したいな~なんて思いまして、曲線について勉強しております。パソコンで曲線...記事を読む楽天ウェブサービスAPIを使って、ふんどし専門店を作ってみたよ先日、友人と話していたら、「楽天の商品を自動的に検索してサイトで紹介する方法ってないかな?」と聞かれたので、ちょっと調べてみました。...記事を読むショップ宛の注文メールが届かない!トラブルの原因はDMARCでしたショッピングカートで注文を受けた際に、お客様には自動配信メールが届いているのに、お店にはメールが届かないというトラブルが発生しました。