ラベル 開発 の投稿を表示しています。 すべての投稿を表示
ラベル 開発 の投稿を表示しています。 すべての投稿を表示

2017年1月26日木曜日

【Angular2】カスタムディレクティブでの双方向データバインド

結論:できません



でも、イベントを使えばそれっぽいことができます。

■ディレクティブ
import {Component, EventEmitter} from '@angular/core';

@Component({
    selector: 'input-directive',
    inputs: ['inputValue'],
    outputs: ['inputEvent'],
    template: `<input [(ngModel)]="year" (change)="onYearChange($event) />`

export class YearListComponent {
    inputValue: string;
    inputEvent: EventEmitter = new EventEmitter();

    constructor(public manager: ServiceManager) {
    }

    //変更イベント
    public onChange(event) {
        this.inputEvent.emit(event);
    }
}
})


■ディレクティブを呼び出すHTML
<input-directive [inputValue]="data" (inputevent)="data=$event.target.value">
</input-directive>


2017年1月12日木曜日

Angular2でBase64のExcelファイルをAjaxを使ってダウンロードする方法

■前提
・ExcelファイルはASP.NetのWebAPIで作成
 ⇒GETメソッドでxlsxファイルをResponseで返す

■ポイント
・responseTypeでArrayBufferを指定


this.http.get("http://hogehoge.com", { responseType: ResponseContentType.ArrayBuffer })
    .subscribe(
        data => {
            var blob = new Blob([data.arrayBuffer()], { type: data.headers.get("content-type") });
            var fName: string;
            fName = decodeURI(data.headers.get("content-disposition").substring(data.headers.get("content-disposition").indexOf('=') + 1));
            //IEの場合
            if (window.navigator.msSaveBlob) {
                window.navigator.msSaveOrOpenBlob(blob, fName);
            } else {
                //それ以外の場合(Chromeしか確認していない)
                var a = document.createElement('a');
                a.download = fName;
                a.target = '_blank';
                a.href = window.URL.createObjectURL(blob);
                a.click();
            }
        }
    )

2017年1月6日金曜日

WebAPIでEPPlusで作成したExcelブックをダウンロードする手順

ASP.NetでWebAPIを使ったサーバサイド処理にて、
EPPlusで作成したExcelブックをダウンロードさせる手順。
細かいところは省略してます。

public HttpResponseMessage Get([FromUri] SagyouNumKousuParamModelGet modelParam)
{
    //レスポンスインスタンス生成
    HttpResponseMessage response = this.Request.CreateResponse(HttpStatusCode.OK);

    using (ExcelPackage inputFile = new ExcelPackage(new System.IO.FileInfo(HttpContext.Current.Server.MapPath("./") + "assets\\Template.xlsx"), false))
    {
        //inputFileに対して色々と処理
        
        //Content作成
        response.Content = new ByteArrayContent(inputFile.GetAsByteArray());
        //Contentヘッダ設定
        response.Content.Headers.Add("Content-Type", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet");
        response.Content.Headers.Add("content-disposition", "attachment;  filename=Sample.xlsx");
    }
}

EPPlusで名前付きセルの範囲を取得する

名前が定義されているのはNamesプロパティ。
シートに対する操作なので”ExcelWorksheet.Names["hogehoge"]”としてしまいがちだがこれではダメ。

名前はWorkbookで一意となるため、”ExcelWorkbook.Names["hogehoge"]”とする。


以下サンプル。
ExcelWorkbook workBook = inputFile.Workbook;
ExcelWorksheet template = inputFile.Workbook.Worksheets["Template"];
ExcelWorksheet workSheet = inputFile.Workbook.Worksheets.Add("Sheet1");

//名前「ヘッダ」の範囲をA1にコピー
workBook.Names["ヘッダ"].Copy(workSheet.Cells[1, 1]);

2016年12月20日火曜日

Angular2でng-show

Angular2ではng-showがありません。


<div ngshow="data">....</div>


なんて書くとエラーで怒られてしまいます。


こんな時はこう書きましょう。


<div [hidden]="!data">....</div>


hiddenなのでtrueの時に隠れちゃいますから、否定の!をつけるのを忘れないようにご注意を。

「Cannot read property 'directive' of undefined in Wijmo grid」の対応

【事象】
Wijmo5の以下のディレクティブを使用するとエラーが発生する。
・wj-flex-grid-column
・wj-flex-grid-filter

【エラー内容】
TypeError: Cannot read property ‘directive’ of undefined

【構成】
Angular2:2.2.1
Wijmo:5.20163.234

【対応】
Wijmo5.20163.239にバージョンアップする。
ダウンロードはここから

【参考】
http://wijmo.com/topic/error-when-upgrade-angular-2-2-1-cannot-read-property-directive-of-undefined/



さんきゅーAlex!!

2016年11月22日火曜日

Angular2入門系サイト

■Angular2実践入門
最小構成のためおすすめ。
https://html5experts.jp/yusuke-naka/18596/
2016年3月22日

■Angular2入門風
なかなか
http://qiita.com/sisisin/items/355bb09845c8bea9d430
2016年11月11日

Oracle8iでEntityFrameworkを使う方法

表題の件、すっごい苦労しました。

1.SQLServerを用意
32bitのWindowsに、SQLServerをインストール。SQLServerは当然32bit。
なぜ32bitかというと、あの忌まわしき「Program Files (x86)」のせい。
インストールパスを変えてもSQLServerのインスタンスは「Program Files (x86)」に作成されていまうため、Oracleのライブラリがうまく使えなかったり。

2.レジストリ変更
OracleのDLLを使用するように書き換え。(バックアップを忘れずに)
[HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\MSDTC\MTxOCI]
 "OracleXaLib"="oraclient8.dll"
 "OracleSqlLib"="orasql8.dll"
 "OracleOciLib"="oci.dll"

3.リンクサーバ作成
以下のコマンドでリンクサーバ作成。
 EXEC sp_addlinkedserver   'リンクテーブル名',  'Oracle',  'MSDAORA',  'TSN名'
 EXEC sp_addlinkedsrvlogin 'リンクテーブル名', 'FALSE',NULL, 'ログインID', 'パスワード'

4.VIEW作成
シノニムはEntityFrameworkで使えないのでVIEWを使う。
例)CREATE VIEW VIEW_1 AS SELECT * FROM [リンクサーバ名]..[スキーマ名].[テーブル名]


以上。
これでEntityFrameworkでアクセスできるOracle8iのできあがり。

【参考】

EntityFrameworkのEntityをJSONに変換


EntityFrameworkのEntityをWebAPIでJSON形式で返したかったので、変換してくれるライブラリを探してると、Json.NETというライブラリを見つけた。

サイトからダウンロードするか、NuGetで入手。
WebApplicationプロジェクトだと標準で入ってるかも。

■NuGetのインストールコマンド
PM> Install-Package Newtonsoft.Json


■使い方
string json = JsonConvert.SerializeObject(query);


とってもシンプル。